<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>IconFont Demo</title>
  <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1206937" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe740;</span>
                <div class="name">pdf</div>
                <div class="code-name">&amp;#xe740;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67a;</span>
                <div class="name">img</div>
                <div class="code-name">&amp;#xe67a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64b;</span>
                <div class="name">工业4.0</div>
                <div class="code-name">&amp;#xe64b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69b;</span>
                <div class="name">jpg</div>
                <div class="code-name">&amp;#xe69b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69c;</span>
                <div class="name">doc</div>
                <div class="code-name">&amp;#xe69c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe625;</span>
                <div class="name">text</div>
                <div class="code-name">&amp;#xe625;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60b;</span>
                <div class="name">pdf</div>
                <div class="code-name">&amp;#xe60b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe607;</span>
                <div class="name">图纸 (2)</div>
                <div class="code-name">&amp;#xe607;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe617;</span>
                <div class="name">图纸</div>
                <div class="code-name">&amp;#xe617;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe670;</span>
                <div class="name">工业设施</div>
                <div class="code-name">&amp;#xe670;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe605;</span>
                <div class="name">零件</div>
                <div class="code-name">&amp;#xe605;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb61;</span>
                <div class="name">调试</div>
                <div class="code-name">&amp;#xeb61;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb62;</span>
                <div class="name">场景管理</div>
                <div class="code-name">&amp;#xeb62;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb63;</span>
                <div class="name">编辑</div>
                <div class="code-name">&amp;#xeb63;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb64;</span>
                <div class="name">关联设备</div>
                <div class="code-name">&amp;#xeb64;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb65;</span>
                <div class="name">官方版本</div>
                <div class="code-name">&amp;#xeb65;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb66;</span>
                <div class="name">功能定义</div>
                <div class="code-name">&amp;#xeb66;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb67;</span>
                <div class="name">基础管理</div>
                <div class="code-name">&amp;#xeb67;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb68;</span>
                <div class="name">技术服务</div>
                <div class="code-name">&amp;#xeb68;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb69;</span>
                <div class="name">合作伙伴密钥管理</div>
                <div class="code-name">&amp;#xeb69;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb6a;</span>
                <div class="name">人机交互</div>
                <div class="code-name">&amp;#xeb6a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb6b;</span>
                <div class="name">使用文档</div>
                <div class="code-name">&amp;#xeb6b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb6c;</span>
                <div class="name">权限审批</div>
                <div class="code-name">&amp;#xeb6c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb6d;</span>
                <div class="name">已授权</div>
                <div class="code-name">&amp;#xeb6d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb6e;</span>
                <div class="name">提案审批</div>
                <div class="code-name">&amp;#xeb6e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb6f;</span>
                <div class="name">数据看板</div>
                <div class="code-name">&amp;#xeb6f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb70;</span>
                <div class="name">仪表盘</div>
                <div class="code-name">&amp;#xeb70;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb71;</span>
                <div class="name">账号权限管理</div>
                <div class="code-name">&amp;#xeb71;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb72;</span>
                <div class="name">园区运维</div>
                <div class="code-name">&amp;#xeb72;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb73;</span>
                <div class="name">基站管理</div>
                <div class="code-name">&amp;#xeb73;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64f;</span>
                <div class="name">doc</div>
                <div class="code-name">&amp;#xe64f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe650;</span>
                <div class="name">ppt</div>
                <div class="code-name">&amp;#xe650;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe651;</span>
                <div class="name">pdf</div>
                <div class="code-name">&amp;#xe651;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb92;</span>
                <div class="name">icon_帮助文档</div>
                <div class="code-name">&amp;#xeb92;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb95;</span>
                <div class="name">表单组件-表格</div>
                <div class="code-name">&amp;#xeb95;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb97;</span>
                <div class="name">表单组件-下拉框</div>
                <div class="code-name">&amp;#xeb97;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb94;</span>
                <div class="name">工业组件-仪表盘</div>
                <div class="code-name">&amp;#xeb94;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb96;</span>
                <div class="name">工业组件-指示灯</div>
                <div class="code-name">&amp;#xeb96;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb98;</span>
                <div class="name">形状-矩形</div>
                <div class="code-name">&amp;#xeb98;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb99;</span>
                <div class="name">工业组件-开关</div>
                <div class="code-name">&amp;#xeb99;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebce;</span>
                <div class="name">技术服务</div>
                <div class="code-name">&amp;#xebce;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebd0;</span>
                <div class="name">运营中心</div>
                <div class="code-name">&amp;#xebd0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebd1;</span>
                <div class="name">运营管理</div>
                <div class="code-name">&amp;#xebd1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebd8;</span>
                <div class="name">组织下辖</div>
                <div class="code-name">&amp;#xebd8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebd9;</span>
                <div class="name">组织群组</div>
                <div class="code-name">&amp;#xebd9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebdf;</span>
                <div class="name">打开</div>
                <div class="code-name">&amp;#xebdf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63e;</span>
                <div class="name">JPG</div>
                <div class="code-name">&amp;#xe63e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe645;</span>
                <div class="name">PDF</div>
                <div class="code-name">&amp;#xe645;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebfd;</span>
                <div class="name">0601-重大危险</div>
                <div class="code-name">&amp;#xebfd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec08;</span>
                <div class="name">刷新</div>
                <div class="code-name">&amp;#xec08;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec09;</span>
                <div class="name">保存</div>
                <div class="code-name">&amp;#xec09;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe609;</span>
                <div class="name">Document generation</div>
                <div class="code-name">&amp;#xe609;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec13;</span>
                <div class="name">缩小</div>
                <div class="code-name">&amp;#xec13;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec14;</span>
                <div class="name">放大</div>
                <div class="code-name">&amp;#xec14;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec15;</span>
                <div class="name">还原画布</div>
                <div class="code-name">&amp;#xec15;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec16;</span>
                <div class="name">表单组件-表格</div>
                <div class="code-name">&amp;#xec16;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe674;</span>
                <div class="name">document</div>
                <div class="code-name">&amp;#xe674;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec17;</span>
                <div class="name">DOC</div>
                <div class="code-name">&amp;#xec17;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec18;</span>
                <div class="name">PNG</div>
                <div class="code-name">&amp;#xec18;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec1d;</span>
                <div class="name">云端下载</div>
                <div class="code-name">&amp;#xec1d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe637;</span>
                <div class="name">Excel</div>
                <div class="code-name">&amp;#xe637;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63a;</span>
                <div class="name">ppt</div>
                <div class="code-name">&amp;#xe63a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a8;</span>
                <div class="name">file_cad</div>
                <div class="code-name">&amp;#xe6a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec23;</span>
                <div class="name">设备状态</div>
                <div class="code-name">&amp;#xec23;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec24;</span>
                <div class="name">分组管理</div>
                <div class="code-name">&amp;#xec24;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec2e;</span>
                <div class="name">软件开发包</div>
                <div class="code-name">&amp;#xec2e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe639;</span>
                <div class="name">PPT</div>
                <div class="code-name">&amp;#xe639;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe758;</span>
                <div class="name">工业的-2</div>
                <div class="code-name">&amp;#xe758;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe759;</span>
                <div class="name">工业的-4</div>
                <div class="code-name">&amp;#xe759;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe765;</span>
                <div class="name">工业的-38</div>
                <div class="code-name">&amp;#xe765;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe767;</span>
                <div class="name">工业的-43</div>
                <div class="code-name">&amp;#xe767;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe773;</span>
                <div class="name">工业的-56</div>
                <div class="code-name">&amp;#xe773;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe778;</span>
                <div class="name">工业的-63</div>
                <div class="code-name">&amp;#xe778;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe779;</span>
                <div class="name">工业的-69</div>
                <div class="code-name">&amp;#xe779;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe77a;</span>
                <div class="name">工业的-73</div>
                <div class="code-name">&amp;#xe77a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe77b;</span>
                <div class="name">工业的-79</div>
                <div class="code-name">&amp;#xe77b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe77f;</span>
                <div class="name">工业的-98</div>
                <div class="code-name">&amp;#xe77f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec33;</span>
                <div class="name">物模型</div>
                <div class="code-name">&amp;#xec33;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec35;</span>
                <div class="name">任务进程</div>
                <div class="code-name">&amp;#xec35;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec36;</span>
                <div class="name">消息通知</div>
                <div class="code-name">&amp;#xec36;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec37;</span>
                <div class="name">执行反馈</div>
                <div class="code-name">&amp;#xec37;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec38;</span>
                <div class="name">工单确认</div>
                <div class="code-name">&amp;#xec38;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec45;</span>
                <div class="name">删除色块</div>
                <div class="code-name">&amp;#xec45;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">PNG</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61f;</span>
                <div class="name">PPT</div>
                <div class="code-name">&amp;#xe61f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">TEXT</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec51;</span>
                <div class="name">管道</div>
                <div class="code-name">&amp;#xec51;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec53;</span>
                <div class="name">规则引擎</div>
                <div class="code-name">&amp;#xec53;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec54;</span>
                <div class="name">检测器</div>
                <div class="code-name">&amp;#xec54;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec56;</span>
                <div class="name">流计算</div>
                <div class="code-name">&amp;#xec56;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec57;</span>
                <div class="name">连接流</div>
                <div class="code-name">&amp;#xec57;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec5c;</span>
                <div class="name">数据挖掘</div>
                <div class="code-name">&amp;#xec5c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec5d;</span>
                <div class="name">网关</div>
                <div class="code-name">&amp;#xec5d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec5f;</span>
                <div class="name">AI</div>
                <div class="code-name">&amp;#xec5f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec66;</span>
                <div class="name">折线图</div>
                <div class="code-name">&amp;#xec66;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec6f;</span>
                <div class="name">神经</div>
                <div class="code-name">&amp;#xec6f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec7a;</span>
                <div class="name">复制</div>
                <div class="code-name">&amp;#xec7a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe769;</span>
                <div class="name">drag</div>
                <div class="code-name">&amp;#xe769;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76a;</span>
                <div class="name">ellipsis-v</div>
                <div class="code-name">&amp;#xe76a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76b;</span>
                <div class="name">gallery-view</div>
                <div class="code-name">&amp;#xe76b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76c;</span>
                <div class="name">WIFI</div>
                <div class="code-name">&amp;#xe76c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76d;</span>
                <div class="name">bug-report</div>
                <div class="code-name">&amp;#xe76d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76e;</span>
                <div class="name">qrcode</div>
                <div class="code-name">&amp;#xe76e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76f;</span>
                <div class="name">scan</div>
                <div class="code-name">&amp;#xe76f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe770;</span>
                <div class="name">cut</div>
                <div class="code-name">&amp;#xe770;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe771;</span>
                <div class="name">gift</div>
                <div class="code-name">&amp;#xe771;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe772;</span>
                <div class="name">link</div>
                <div class="code-name">&amp;#xe772;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe774;</span>
                <div class="name">poweroff</div>
                <div class="code-name">&amp;#xe774;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe775;</span>
                <div class="name">key</div>
                <div class="code-name">&amp;#xe775;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe776;</span>
                <div class="name">safety-certificate</div>
                <div class="code-name">&amp;#xe776;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe777;</span>
                <div class="name">supervise</div>
                <div class="code-name">&amp;#xe777;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe78a;</span>
                <div class="name">tag-subscipt</div>
                <div class="code-name">&amp;#xe78a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe78c;</span>
                <div class="name">chart-pie-alt</div>
                <div class="code-name">&amp;#xe78c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe78d;</span>
                <div class="name">chart-relation</div>
                <div class="code-name">&amp;#xe78d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe78e;</span>
                <div class="name">chart-scatter-plot</div>
                <div class="code-name">&amp;#xe78e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe78f;</span>
                <div class="name">chart-area</div>
                <div class="code-name">&amp;#xe78f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe790;</span>
                <div class="name">chart-line</div>
                <div class="code-name">&amp;#xe790;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe791;</span>
                <div class="name">chart-bar</div>
                <div class="code-name">&amp;#xe791;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe792;</span>
                <div class="name">display-code</div>
                <div class="code-name">&amp;#xe792;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe793;</span>
                <div class="name">display-arrow-right</div>
                <div class="code-name">&amp;#xe793;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe794;</span>
                <div class="name">display-arrow-left</div>
                <div class="code-name">&amp;#xe794;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe795;</span>
                <div class="name">laptop-error</div>
                <div class="code-name">&amp;#xe795;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe796;</span>
                <div class="name">laptop-check</div>
                <div class="code-name">&amp;#xe796;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe797;</span>
                <div class="name">laptop</div>
                <div class="code-name">&amp;#xe797;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe798;</span>
                <div class="name">mobile-error</div>
                <div class="code-name">&amp;#xe798;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe799;</span>
                <div class="name">mobile-check</div>
                <div class="code-name">&amp;#xe799;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe79a;</span>
                <div class="name">mobile-alt</div>
                <div class="code-name">&amp;#xe79a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe79d;</span>
                <div class="name">aliwangwang</div>
                <div class="code-name">&amp;#xe79d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe79e;</span>
                <div class="name">nail</div>
                <div class="code-name">&amp;#xe79e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe79f;</span>
                <div class="name">nail-fixed</div>
                <div class="code-name">&amp;#xe79f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a0;</span>
                <div class="name">edit</div>
                <div class="code-name">&amp;#xe7a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a1;</span>
                <div class="name">dollar</div>
                <div class="code-name">&amp;#xe7a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a2;</span>
                <div class="name">transanction</div>
                <div class="code-name">&amp;#xe7a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a3;</span>
                <div class="name">filter-fill</div>
                <div class="code-name">&amp;#xe7a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a4;</span>
                <div class="name">all-fill</div>
                <div class="code-name">&amp;#xe7a4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a5;</span>
                <div class="name">database plus-fill</div>
                <div class="code-name">&amp;#xe7a5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a6;</span>
                <div class="name">database-fill</div>
                <div class="code-name">&amp;#xe7a6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a7;</span>
                <div class="name">comment lines-fill</div>
                <div class="code-name">&amp;#xe7a7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a8;</span>
                <div class="name">comment dots-fill</div>
                <div class="code-name">&amp;#xe7a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7a9;</span>
                <div class="name">paper plane-fill</div>
                <div class="code-name">&amp;#xe7a9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7aa;</span>
                <div class="name">eye slash-fill</div>
                <div class="code-name">&amp;#xe7aa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ab;</span>
                <div class="name">eye-fill</div>
                <div class="code-name">&amp;#xe7ab;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ac;</span>
                <div class="name">lightbulb-fill</div>
                <div class="code-name">&amp;#xe7ac;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ad;</span>
                <div class="name">flag-fill</div>
                <div class="code-name">&amp;#xe7ad;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ae;</span>
                <div class="name">tag-fill</div>
                <div class="code-name">&amp;#xe7ae;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7af;</span>
                <div class="name">position-fill</div>
                <div class="code-name">&amp;#xe7af;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b0;</span>
                <div class="name">location-fill</div>
                <div class="code-name">&amp;#xe7b0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b1;</span>
                <div class="name">map-fill</div>
                <div class="code-name">&amp;#xe7b1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b2;</span>
                <div class="name">inbox in-fill</div>
                <div class="code-name">&amp;#xe7b2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b3;</span>
                <div class="name">box-fill</div>
                <div class="code-name">&amp;#xe7b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b4;</span>
                <div class="name">database set-fill</div>
                <div class="code-name">&amp;#xe7b4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b5;</span>
                <div class="name">layer group-fill</div>
                <div class="code-name">&amp;#xe7b5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b6;</span>
                <div class="name">cry-fill</div>
                <div class="code-name">&amp;#xe7b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b7;</span>
                <div class="name">smile-fill</div>
                <div class="code-name">&amp;#xe7b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b8;</span>
                <div class="name">unlock-fill</div>
                <div class="code-name">&amp;#xe7b8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b9;</span>
                <div class="name">lock-fill</div>
                <div class="code-name">&amp;#xe7b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ba;</span>
                <div class="name">align right-fill</div>
                <div class="code-name">&amp;#xe7ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7bb;</span>
                <div class="name">align left-fill</div>
                <div class="code-name">&amp;#xe7bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7bc;</span>
                <div class="name">border bottom-fill</div>
                <div class="code-name">&amp;#xe7bc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7bd;</span>
                <div class="name">border top-fill</div>
                <div class="code-name">&amp;#xe7bd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7be;</span>
                <div class="name">align center-fill</div>
                <div class="code-name">&amp;#xe7be;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7bf;</span>
                <div class="name">border verticle-fill</div>
                <div class="code-name">&amp;#xe7bf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c0;</span>
                <div class="name">pic center-fill</div>
                <div class="code-name">&amp;#xe7c0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c1;</span>
                <div class="name">pic side-fill</div>
                <div class="code-name">&amp;#xe7c1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c2;</span>
                <div class="name">folder open-fill</div>
                <div class="code-name">&amp;#xe7c2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c3;</span>
                <div class="name">folder plus-fill</div>
                <div class="code-name">&amp;#xe7c3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c4;</span>
                <div class="name">folder-fill</div>
                <div class="code-name">&amp;#xe7c4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c5;</span>
                <div class="name">file-SQL</div>
                <div class="code-name">&amp;#xe7c5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c6;</span>
                <div class="name">file plus-fill</div>
                <div class="code-name">&amp;#xe7c6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c7;</span>
                <div class="name">file-fill</div>
                <div class="code-name">&amp;#xe7c7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c8;</span>
                <div class="name">copy-fill</div>
                <div class="code-name">&amp;#xe7c8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c9;</span>
                <div class="name">headset-fill</div>
                <div class="code-name">&amp;#xe7c9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ca;</span>
                <div class="name">phone-fill</div>
                <div class="code-name">&amp;#xe7ca;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7cb;</span>
                <div class="name">pause circle-fill</div>
                <div class="code-name">&amp;#xe7cb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7cc;</span>
                <div class="name">stop circle-fill</div>
                <div class="code-name">&amp;#xe7cc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7cd;</span>
                <div class="name">play circle-fill</div>
                <div class="code-name">&amp;#xe7cd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ce;</span>
                <div class="name">delete-fill</div>
                <div class="code-name">&amp;#xe7ce;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7cf;</span>
                <div class="name">picture-fill</div>
                <div class="code-name">&amp;#xe7cf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d0;</span>
                <div class="name">mail-fill</div>
                <div class="code-name">&amp;#xe7d0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d1;</span>
                <div class="name">heart-fill</div>
                <div class="code-name">&amp;#xe7d1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d2;</span>
                <div class="name">collection-fill</div>
                <div class="code-name">&amp;#xe7d2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d3;</span>
                <div class="name">user-group-fill</div>
                <div class="code-name">&amp;#xe7d3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d4;</span>
                <div class="name">user plus-fill</div>
                <div class="code-name">&amp;#xe7d4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d5;</span>
                <div class="name">user-fill</div>
                <div class="code-name">&amp;#xe7d5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d6;</span>
                <div class="name">cog-fill</div>
                <div class="code-name">&amp;#xe7d6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d7;</span>
                <div class="name">clock-fill</div>
                <div class="code-name">&amp;#xe7d7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d8;</span>
                <div class="name">calendar alt-fill</div>
                <div class="code-name">&amp;#xe7d8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7d9;</span>
                <div class="name">cloud download-fill</div>
                <div class="code-name">&amp;#xe7d9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7da;</span>
                <div class="name">cloud upload-fill</div>
                <div class="code-name">&amp;#xe7da;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7db;</span>
                <div class="name">exchange-fill</div>
                <div class="code-name">&amp;#xe7db;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7dc;</span>
                <div class="name">info-circle-fill</div>
                <div class="code-name">&amp;#xe7dc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7dd;</span>
                <div class="name">question-circle-fill</div>
                <div class="code-name">&amp;#xe7dd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7de;</span>
                <div class="name">exclamation circle-f</div>
                <div class="code-name">&amp;#xe7de;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7df;</span>
                <div class="name">minus-circle-fill</div>
                <div class="code-name">&amp;#xe7df;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e0;</span>
                <div class="name">plus-circle-fill</div>
                <div class="code-name">&amp;#xe7e0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e1;</span>
                <div class="name">times-circle-fill</div>
                <div class="code-name">&amp;#xe7e1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e2;</span>
                <div class="name">check-circle-fill</div>
                <div class="code-name">&amp;#xe7e2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e3;</span>
                <div class="name">compress alt-fill</div>
                <div class="code-name">&amp;#xe7e3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e4;</span>
                <div class="name">expand alt-fill</div>
                <div class="code-name">&amp;#xe7e4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e5;</span>
                <div class="name">filter</div>
                <div class="code-name">&amp;#xe7e5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e6;</span>
                <div class="name">all</div>
                <div class="code-name">&amp;#xe7e6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e7;</span>
                <div class="name">database-plus</div>
                <div class="code-name">&amp;#xe7e7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e8;</span>
                <div class="name">database</div>
                <div class="code-name">&amp;#xe7e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e9;</span>
                <div class="name">comment-lines</div>
                <div class="code-name">&amp;#xe7e9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ea;</span>
                <div class="name">comment-dots</div>
                <div class="code-name">&amp;#xe7ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7eb;</span>
                <div class="name">paper-plane</div>
                <div class="code-name">&amp;#xe7eb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ec;</span>
                <div class="name">eye-slash</div>
                <div class="code-name">&amp;#xe7ec;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ed;</span>
                <div class="name">eye</div>
                <div class="code-name">&amp;#xe7ed;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ee;</span>
                <div class="name">lightbulb</div>
                <div class="code-name">&amp;#xe7ee;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ef;</span>
                <div class="name">flag</div>
                <div class="code-name">&amp;#xe7ef;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f0;</span>
                <div class="name">tag</div>
                <div class="code-name">&amp;#xe7f0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f1;</span>
                <div class="name">position</div>
                <div class="code-name">&amp;#xe7f1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f2;</span>
                <div class="name">location</div>
                <div class="code-name">&amp;#xe7f2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f3;</span>
                <div class="name">map</div>
                <div class="code-name">&amp;#xe7f3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f4;</span>
                <div class="name">inbox-in</div>
                <div class="code-name">&amp;#xe7f4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f5;</span>
                <div class="name">box</div>
                <div class="code-name">&amp;#xe7f5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f6;</span>
                <div class="name">database-set</div>
                <div class="code-name">&amp;#xe7f6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f7;</span>
                <div class="name">layer-group</div>
                <div class="code-name">&amp;#xe7f7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f8;</span>
                <div class="name">wind-cry</div>
                <div class="code-name">&amp;#xe7f8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f9;</span>
                <div class="name">wind-smile</div>
                <div class="code-name">&amp;#xe7f9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7fa;</span>
                <div class="name">unlock</div>
                <div class="code-name">&amp;#xe7fa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7fb;</span>
                <div class="name">lock</div>
                <div class="code-name">&amp;#xe7fb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7fc;</span>
                <div class="name">align-right</div>
                <div class="code-name">&amp;#xe7fc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7fd;</span>
                <div class="name">align-left</div>
                <div class="code-name">&amp;#xe7fd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7fe;</span>
                <div class="name">border-bottom</div>
                <div class="code-name">&amp;#xe7fe;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ff;</span>
                <div class="name">border-top</div>
                <div class="code-name">&amp;#xe7ff;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe800;</span>
                <div class="name">align-center</div>
                <div class="code-name">&amp;#xe800;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe801;</span>
                <div class="name">border-verticle</div>
                <div class="code-name">&amp;#xe801;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe802;</span>
                <div class="name">pic-center</div>
                <div class="code-name">&amp;#xe802;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe803;</span>
                <div class="name">pic-side</div>
                <div class="code-name">&amp;#xe803;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe804;</span>
                <div class="name">folder-open</div>
                <div class="code-name">&amp;#xe804;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe805;</span>
                <div class="name">folder-plus</div>
                <div class="code-name">&amp;#xe805;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe806;</span>
                <div class="name">folder</div>
                <div class="code-name">&amp;#xe806;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe807;</span>
                <div class="name">file-SQL</div>
                <div class="code-name">&amp;#xe807;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe808;</span>
                <div class="name">file-plus</div>
                <div class="code-name">&amp;#xe808;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe809;</span>
                <div class="name">file</div>
                <div class="code-name">&amp;#xe809;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe80a;</span>
                <div class="name">copy</div>
                <div class="code-name">&amp;#xe80a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe80b;</span>
                <div class="name">headset</div>
                <div class="code-name">&amp;#xe80b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe80c;</span>
                <div class="name">phone</div>
                <div class="code-name">&amp;#xe80c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe80d;</span>
                <div class="name">pause circle</div>
                <div class="code-name">&amp;#xe80d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe80e;</span>
                <div class="name">stop circle</div>
                <div class="code-name">&amp;#xe80e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe80f;</span>
                <div class="name">play circle</div>
                <div class="code-name">&amp;#xe80f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe810;</span>
                <div class="name">delete</div>
                <div class="code-name">&amp;#xe810;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe811;</span>
                <div class="name">picture</div>
                <div class="code-name">&amp;#xe811;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe812;</span>
                <div class="name">mail</div>
                <div class="code-name">&amp;#xe812;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe813;</span>
                <div class="name">like</div>
                <div class="code-name">&amp;#xe813;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe814;</span>
                <div class="name">collection</div>
                <div class="code-name">&amp;#xe814;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe815;</span>
                <div class="name">user-group</div>
                <div class="code-name">&amp;#xe815;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe816;</span>
                <div class="name">account-plus</div>
                <div class="code-name">&amp;#xe816;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe817;</span>
                <div class="name">account</div>
                <div class="code-name">&amp;#xe817;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe818;</span>
                <div class="name">cog</div>
                <div class="code-name">&amp;#xe818;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe819;</span>
                <div class="name">clock</div>
                <div class="code-name">&amp;#xe819;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe81a;</span>
                <div class="name">calendar-alt</div>
                <div class="code-name">&amp;#xe81a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe81b;</span>
                <div class="name">cloud download</div>
                <div class="code-name">&amp;#xe81b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe81c;</span>
                <div class="name">cloud upload</div>
                <div class="code-name">&amp;#xe81c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe81d;</span>
                <div class="name">exchange</div>
                <div class="code-name">&amp;#xe81d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe81e;</span>
                <div class="name">info-circle</div>
                <div class="code-name">&amp;#xe81e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe81f;</span>
                <div class="name">question-circle</div>
                <div class="code-name">&amp;#xe81f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe820;</span>
                <div class="name">exclamation-circle</div>
                <div class="code-name">&amp;#xe820;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe821;</span>
                <div class="name">minus-circle</div>
                <div class="code-name">&amp;#xe821;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe822;</span>
                <div class="name">plus-circle</div>
                <div class="code-name">&amp;#xe822;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe823;</span>
                <div class="name">times-circle</div>
                <div class="code-name">&amp;#xe823;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe824;</span>
                <div class="name">check-circle</div>
                <div class="code-name">&amp;#xe824;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe825;</span>
                <div class="name">compress-alt</div>
                <div class="code-name">&amp;#xe825;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe826;</span>
                <div class="name">expand-alt</div>
                <div class="code-name">&amp;#xe826;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe827;</span>
                <div class="name">ban</div>
                <div class="code-name">&amp;#xe827;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe828;</span>
                <div class="name">minus</div>
                <div class="code-name">&amp;#xe828;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe829;</span>
                <div class="name">plus</div>
                <div class="code-name">&amp;#xe829;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe82a;</span>
                <div class="name">times</div>
                <div class="code-name">&amp;#xe82a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe82b;</span>
                <div class="name">check</div>
                <div class="code-name">&amp;#xe82b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe82c;</span>
                <div class="name">search-minus</div>
                <div class="code-name">&amp;#xe82c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe82d;</span>
                <div class="name">search-plus</div>
                <div class="code-name">&amp;#xe82d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe82e;</span>
                <div class="name">search</div>
                <div class="code-name">&amp;#xe82e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe82f;</span>
                <div class="name">reply</div>
                <div class="code-name">&amp;#xe82f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe830;</span>
                <div class="name">undo</div>
                <div class="code-name">&amp;#xe830;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe831;</span>
                <div class="name">redo</div>
                <div class="code-name">&amp;#xe831;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe832;</span>
                <div class="name">external-link</div>
                <div class="code-name">&amp;#xe832;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe833;</span>
                <div class="name">arrows-alt</div>
                <div class="code-name">&amp;#xe833;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe834;</span>
                <div class="name">indent</div>
                <div class="code-name">&amp;#xe834;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe835;</span>
                <div class="name">outdent</div>
                <div class="code-name">&amp;#xe835;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe836;</span>
                <div class="name">sort-line</div>
                <div class="code-name">&amp;#xe836;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe837;</span>
                <div class="name">switch</div>
                <div class="code-name">&amp;#xe837;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe838;</span>
                <div class="name">wind-descending</div>
                <div class="code-name">&amp;#xe838;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe839;</span>
                <div class="name">wind-ascending</div>
                <div class="code-name">&amp;#xe839;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe83a;</span>
                <div class="name">download</div>
                <div class="code-name">&amp;#xe83a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe83b;</span>
                <div class="name">upload</div>
                <div class="code-name">&amp;#xe83b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe83c;</span>
                <div class="name">arrow-to-bottom</div>
                <div class="code-name">&amp;#xe83c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe83d;</span>
                <div class="name">arrow-to-top</div>
                <div class="code-name">&amp;#xe83d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe83e;</span>
                <div class="name">long-arrow-down</div>
                <div class="code-name">&amp;#xe83e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe83f;</span>
                <div class="name">long-arrow-up</div>
                <div class="code-name">&amp;#xe83f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe840;</span>
                <div class="name">arrow-right</div>
                <div class="code-name">&amp;#xe840;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe841;</span>
                <div class="name">arrow-left</div>
                <div class="code-name">&amp;#xe841;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe842;</span>
                <div class="name">sort</div>
                <div class="code-name">&amp;#xe842;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe843;</span>
                <div class="name">sort-down</div>
                <div class="code-name">&amp;#xe843;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe844;</span>
                <div class="name">sort-up</div>
                <div class="code-name">&amp;#xe844;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe845;</span>
                <div class="name">caret-right</div>
                <div class="code-name">&amp;#xe845;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe846;</span>
                <div class="name">caret-left</div>
                <div class="code-name">&amp;#xe846;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe847;</span>
                <div class="name">arrows-v</div>
                <div class="code-name">&amp;#xe847;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe848;</span>
                <div class="name">angle- double-down</div>
                <div class="code-name">&amp;#xe848;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe849;</span>
                <div class="name">angle-double-up</div>
                <div class="code-name">&amp;#xe849;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe84a;</span>
                <div class="name">angle-double-right</div>
                <div class="code-name">&amp;#xe84a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe84b;</span>
                <div class="name">angle-double-left</div>
                <div class="code-name">&amp;#xe84b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe84c;</span>
                <div class="name">angle-down</div>
                <div class="code-name">&amp;#xe84c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe84d;</span>
                <div class="name">angle-up</div>
                <div class="code-name">&amp;#xe84d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe84e;</span>
                <div class="name">angle-right</div>
                <div class="code-name">&amp;#xe84e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe84f;</span>
                <div class="name">angle-left</div>
                <div class="code-name">&amp;#xe84f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">CAD设置2</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe850;</span>
                <div class="name">paperclip</div>
                <div class="code-name">&amp;#xe850;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63b;</span>
                <div class="name">CAD设置2_相反</div>
                <div class="code-name">&amp;#xe63b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe851;</span>
                <div class="name">connection</div>
                <div class="code-name">&amp;#xe851;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe853;</span>
                <div class="name">training</div>
                <div class="code-name">&amp;#xe853;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe854;</span>
                <div class="name">process</div>
                <div class="code-name">&amp;#xe854;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe855;</span>
                <div class="name">news</div>
                <div class="code-name">&amp;#xe855;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe856;</span>
                <div class="name">save</div>
                <div class="code-name">&amp;#xe856;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe857;</span>
                <div class="name">print</div>
                <div class="code-name">&amp;#xe857;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe858;</span>
                <div class="name">new-releases</div>
                <div class="code-name">&amp;#xe858;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85a;</span>
                <div class="name">release</div>
                <div class="code-name">&amp;#xe85a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85b;</span>
                <div class="name">alert</div>
                <div class="code-name">&amp;#xe85b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85c;</span>
                <div class="name">backspace</div>
                <div class="code-name">&amp;#xe85c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85d;</span>
                <div class="name">gem</div>
                <div class="code-name">&amp;#xe85d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85e;</span>
                <div class="name">integral</div>
                <div class="code-name">&amp;#xe85e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85f;</span>
                <div class="name">star-circle</div>
                <div class="code-name">&amp;#xe85f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe860;</span>
                <div class="name">user-circle</div>
                <div class="code-name">&amp;#xe860;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe861;</span>
                <div class="name">cloud-machine-fill</div>
                <div class="code-name">&amp;#xe861;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe862;</span>
                <div class="name">cloud-machine</div>
                <div class="code-name">&amp;#xe862;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe863;</span>
                <div class="name">terminal-fill</div>
                <div class="code-name">&amp;#xe863;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe864;</span>
                <div class="name">terminal</div>
                <div class="code-name">&amp;#xe864;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe865;</span>
                <div class="name">shopping-cart-fill</div>
                <div class="code-name">&amp;#xe865;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec7d;</span>
                <div class="name">iframe添加</div>
                <div class="code-name">&amp;#xec7d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec7e;</span>
                <div class="name">图片添加</div>
                <div class="code-name">&amp;#xec7e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe867;</span>
                <div class="name">resource</div>
                <div class="code-name">&amp;#xe867;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe869;</span>
                <div class="name">wind-loading</div>
                <div class="code-name">&amp;#xe869;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe86a;</span>
                <div class="name">rank</div>
                <div class="code-name">&amp;#xe86a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec85;</span>
                <div class="name">字体颜色</div>
                <div class="code-name">&amp;#xec85;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe86b;</span>
                <div class="name">sync-alt</div>
                <div class="code-name">&amp;#xe86b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe86c;</span>
                <div class="name">compass</div>
                <div class="code-name">&amp;#xe86c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe86d;</span>
                <div class="name">arrow-alt- from-top</div>
                <div class="code-name">&amp;#xe86d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe86e;</span>
                <div class="name">arrow-alt-from-botto</div>
                <div class="code-name">&amp;#xe86e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe86f;</span>
                <div class="name">menu</div>
                <div class="code-name">&amp;#xe86f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe660;</span>
                <div class="name">excel</div>
                <div class="code-name">&amp;#xe660;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec8b;</span>
                <div class="name">设备开发</div>
                <div class="code-name">&amp;#xec8b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe870;</span>
                <div class="name">icon-drag</div>
                <div class="code-name">&amp;#xe870;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe872;</span>
                <div class="name">early-warning</div>
                <div class="code-name">&amp;#xe872;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe873;</span>
                <div class="name">share</div>
                <div class="code-name">&amp;#xe873;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe874;</span>
                <div class="name">share</div>
                <div class="code-name">&amp;#xe874;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe730;</span>
                <div class="name">Png</div>
                <div class="code-name">&amp;#xe730;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe731;</span>
                <div class="name">Jpg</div>
                <div class="code-name">&amp;#xe731;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe733;</span>
                <div class="name">Pdf</div>
                <div class="code-name">&amp;#xe733;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe735;</span>
                <div class="name">doc</div>
                <div class="code-name">&amp;#xe735;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe618;</span>
                <div class="name">img</div>
                <div class="code-name">&amp;#xe618;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe998;</span>
                <div class="name">Excel</div>
                <div class="code-name">&amp;#xe998;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe875;</span>
                <div class="name">management</div>
                <div class="code-name">&amp;#xe875;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe871;</span>
                <div class="name">accesskeys</div>
                <div class="code-name">&amp;#xe871;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xecaa;</span>
                <div class="name">准备量产</div>
                <div class="code-name">&amp;#xecaa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64a;</span>
                <div class="name">添加子图纸</div>
                <div class="code-name">&amp;#xe64a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe631;</span>
                <div class="name">document</div>
                <div class="code-name">&amp;#xe631;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61b;</span>
                <div class="name">Text file 1</div>
                <div class="code-name">&amp;#xe61b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe722;</span>
                <div class="name">CAD设置</div>
                <div class="code-name">&amp;#xe722;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe877;</span>
                <div class="name">arrow-sort down-small</div>
                <div class="code-name">&amp;#xe877;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe878;</span>
                <div class="name">minus-square-fill</div>
                <div class="code-name">&amp;#xe878;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe879;</span>
                <div class="name">plus-square-fill</div>
                <div class="code-name">&amp;#xe879;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe87a;</span>
                <div class="name">minus-square</div>
                <div class="code-name">&amp;#xe87a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe87b;</span>
                <div class="name">plus-square</div>
                <div class="code-name">&amp;#xe87b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe87d;</span>
                <div class="name">step mode</div>
                <div class="code-name">&amp;#xe87d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe87e;</span>
                <div class="name">scrolling mode</div>
                <div class="code-name">&amp;#xe87e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xed1b;</span>
                <div class="name">控件选中</div>
                <div class="code-name">&amp;#xed1b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe600;</span>
                <div class="name">excel-01</div>
                <div class="code-name">&amp;#xe600;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe881;</span>
                <div class="name">shopping cart</div>
                <div class="code-name">&amp;#xe881;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe852;</span>
                <div class="name">Excel</div>
                <div class="code-name">&amp;#xe852;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe882;</span>
                <div class="name">waiting-fill</div>
                <div class="code-name">&amp;#xe882;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe883;</span>
                <div class="name">waiting</div>
                <div class="code-name">&amp;#xe883;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe884;</span>
                <div class="name">right-arrow-rect</div>
                <div class="code-name">&amp;#xe884;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe885;</span>
                <div class="name">left-arrow-rect</div>
                <div class="code-name">&amp;#xe885;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe648;</span>
                <div class="name">工业基础零件</div>
                <div class="code-name">&amp;#xe648;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62f;</span>
                <div class="name">导出CAD</div>
                <div class="code-name">&amp;#xe62f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe630;</span>
                <div class="name">导入CAD</div>
                <div class="code-name">&amp;#xe630;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe887;</span>
                <div class="name">bell</div>
                <div class="code-name">&amp;#xe887;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe888;</span>
                <div class="name">structured data</div>
                <div class="code-name">&amp;#xe888;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe889;</span>
                <div class="name">vector</div>
                <div class="code-name">&amp;#xe889;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63f;</span>
                <div class="name">jpg</div>
                <div class="code-name">&amp;#xe63f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe88a;</span>
                <div class="name">NEW</div>
                <div class="code-name">&amp;#xe88a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe88b;</span>
                <div class="name">HOT</div>
                <div class="code-name">&amp;#xe88b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe665;</span>
                <div class="name">系统-角色配置</div>
                <div class="code-name">&amp;#xe665;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8bb;</span>
                <div class="name">ppt</div>
                <div class="code-name">&amp;#xe8bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ba;</span>
                <div class="name">png</div>
                <div class="code-name">&amp;#xe8ba;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.eot');
  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
      url('iconfont.woff2') format('woff2'),
      url('iconfont.woff') format('woff'),
      url('iconfont.ttf') format('truetype'),
      url('iconfont.svg#iconfont') format('svg');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont dy-pdf"></span>
            <div class="name">
              pdf
            </div>
            <div class="code-name">.dy-pdf
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-img"></span>
            <div class="name">
              img
            </div>
            <div class="code-name">.dy-img
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongye40"></span>
            <div class="name">
              工业4.0
            </div>
            <div class="code-name">.dy-gongye40
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-jpg"></span>
            <div class="name">
              jpg
            </div>
            <div class="code-name">.dy-jpg
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-doc"></span>
            <div class="name">
              doc
            </div>
            <div class="code-name">.dy-doc
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-text"></span>
            <div class="name">
              text
            </div>
            <div class="code-name">.dy-text
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-pdf1"></span>
            <div class="name">
              pdf
            </div>
            <div class="code-name">.dy-pdf1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tuzhi"></span>
            <div class="name">
              图纸 (2)
            </div>
            <div class="code-name">.dy-tuzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-icon-book"></span>
            <div class="name">
              图纸
            </div>
            <div class="code-name">.dy-icon-book
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyesheshi"></span>
            <div class="name">
              工业设施
            </div>
            <div class="code-name">.dy-gongyesheshi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-lingjian"></span>
            <div class="name">
              零件
            </div>
            <div class="code-name">.dy-lingjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tiaoshi"></span>
            <div class="name">
              调试
            </div>
            <div class="code-name">.dy-tiaoshi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-changjingguanli"></span>
            <div class="name">
              场景管理
            </div>
            <div class="code-name">.dy-changjingguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-bianji"></span>
            <div class="name">
              编辑
            </div>
            <div class="code-name">.dy-bianji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-guanlianshebei"></span>
            <div class="name">
              关联设备
            </div>
            <div class="code-name">.dy-guanlianshebei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-guanfangbanben"></span>
            <div class="name">
              官方版本
            </div>
            <div class="code-name">.dy-guanfangbanben
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongnengdingyi"></span>
            <div class="name">
              功能定义
            </div>
            <div class="code-name">.dy-gongnengdingyi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-jichuguanli"></span>
            <div class="name">
              基础管理
            </div>
            <div class="code-name">.dy-jichuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-jishufuwu"></span>
            <div class="name">
              技术服务
            </div>
            <div class="code-name">.dy-jishufuwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-hezuohuobanmiyueguanli"></span>
            <div class="name">
              合作伙伴密钥管理
            </div>
            <div class="code-name">.dy-hezuohuobanmiyueguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-renjijiaohu"></span>
            <div class="name">
              人机交互
            </div>
            <div class="code-name">.dy-renjijiaohu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shiyongwendang"></span>
            <div class="name">
              使用文档
            </div>
            <div class="code-name">.dy-shiyongwendang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-quanxianshenpi"></span>
            <div class="name">
              权限审批
            </div>
            <div class="code-name">.dy-quanxianshenpi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-yishouquan"></span>
            <div class="name">
              已授权
            </div>
            <div class="code-name">.dy-yishouquan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tianshenpi"></span>
            <div class="name">
              提案审批
            </div>
            <div class="code-name">.dy-tianshenpi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shujukanban"></span>
            <div class="name">
              数据看板
            </div>
            <div class="code-name">.dy-shujukanban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-yibiaopan"></span>
            <div class="name">
              仪表盘
            </div>
            <div class="code-name">.dy-yibiaopan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-zhanghaoquanxianguanli"></span>
            <div class="name">
              账号权限管理
            </div>
            <div class="code-name">.dy-zhanghaoquanxianguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-yuanquyunwei"></span>
            <div class="name">
              园区运维
            </div>
            <div class="code-name">.dy-yuanquyunwei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-jizhanguanli"></span>
            <div class="name">
              基站管理
            </div>
            <div class="code-name">.dy-jizhanguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-doc1"></span>
            <div class="name">
              doc
            </div>
            <div class="code-name">.dy-doc1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-ppt"></span>
            <div class="name">
              ppt
            </div>
            <div class="code-name">.dy-ppt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-pdf2"></span>
            <div class="name">
              pdf
            </div>
            <div class="code-name">.dy-pdf2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-icon_bangzhuwendang"></span>
            <div class="name">
              icon_帮助文档
            </div>
            <div class="code-name">.dy-icon_bangzhuwendang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-biaodanzujian-biaoge"></span>
            <div class="name">
              表单组件-表格
            </div>
            <div class="code-name">.dy-biaodanzujian-biaoge
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-biaodanzujian-xialakuang"></span>
            <div class="name">
              表单组件-下拉框
            </div>
            <div class="code-name">.dy-biaodanzujian-xialakuang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyezujian-yibiaopan"></span>
            <div class="name">
              工业组件-仪表盘
            </div>
            <div class="code-name">.dy-gongyezujian-yibiaopan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyezujian-zhishideng"></span>
            <div class="name">
              工业组件-指示灯
            </div>
            <div class="code-name">.dy-gongyezujian-zhishideng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-xingzhuang-juxing"></span>
            <div class="name">
              形状-矩形
            </div>
            <div class="code-name">.dy-xingzhuang-juxing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyezujian-kaiguan"></span>
            <div class="name">
              工业组件-开关
            </div>
            <div class="code-name">.dy-gongyezujian-kaiguan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-jishufuwu1"></span>
            <div class="name">
              技术服务
            </div>
            <div class="code-name">.dy-jishufuwu1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-yunyingzhongxin"></span>
            <div class="name">
              运营中心
            </div>
            <div class="code-name">.dy-yunyingzhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-yunyingguanli"></span>
            <div class="name">
              运营管理
            </div>
            <div class="code-name">.dy-yunyingguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-zuzhixiaxia"></span>
            <div class="name">
              组织下辖
            </div>
            <div class="code-name">.dy-zuzhixiaxia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-zuzhiqunzu"></span>
            <div class="name">
              组织群组
            </div>
            <div class="code-name">.dy-zuzhiqunzu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-dakai"></span>
            <div class="name">
              打开
            </div>
            <div class="code-name">.dy-dakai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-JPG"></span>
            <div class="name">
              JPG
            </div>
            <div class="code-name">.dy-JPG
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-PDF"></span>
            <div class="name">
              PDF
            </div>
            <div class="code-name">.dy-PDF
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy--zhongdaweixian"></span>
            <div class="name">
              0601-重大危险
            </div>
            <div class="code-name">.dy--zhongdaweixian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shuaxin"></span>
            <div class="name">
              刷新
            </div>
            <div class="code-name">.dy-shuaxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-baocun"></span>
            <div class="name">
              保存
            </div>
            <div class="code-name">.dy-baocun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-Documentgeneration"></span>
            <div class="name">
              Document generation
            </div>
            <div class="code-name">.dy-Documentgeneration
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-suoxiao"></span>
            <div class="name">
              缩小
            </div>
            <div class="code-name">.dy-suoxiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-fangda"></span>
            <div class="name">
              放大
            </div>
            <div class="code-name">.dy-fangda
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-huanyuanhuabu"></span>
            <div class="name">
              还原画布
            </div>
            <div class="code-name">.dy-huanyuanhuabu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-biaodanzujian-biaoge1"></span>
            <div class="name">
              表单组件-表格
            </div>
            <div class="code-name">.dy-biaodanzujian-biaoge1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-document"></span>
            <div class="name">
              document
            </div>
            <div class="code-name">.dy-document
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-DOC"></span>
            <div class="name">
              DOC
            </div>
            <div class="code-name">.dy-DOC
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-PNG"></span>
            <div class="name">
              PNG
            </div>
            <div class="code-name">.dy-PNG
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-yunduanxiazai"></span>
            <div class="name">
              云端下载
            </div>
            <div class="code-name">.dy-yunduanxiazai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-Excel"></span>
            <div class="name">
              Excel
            </div>
            <div class="code-name">.dy-Excel
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-ppt1"></span>
            <div class="name">
              ppt
            </div>
            <div class="code-name">.dy-ppt1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-file_cad"></span>
            <div class="name">
              file_cad
            </div>
            <div class="code-name">.dy-file_cad
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shebeizhuangtai"></span>
            <div class="name">
              设备状态
            </div>
            <div class="code-name">.dy-shebeizhuangtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-fenzuguanli"></span>
            <div class="name">
              分组管理
            </div>
            <div class="code-name">.dy-fenzuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-ruanjiankaifabao"></span>
            <div class="name">
              软件开发包
            </div>
            <div class="code-name">.dy-ruanjiankaifabao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-zhongguohangtiantubiaoheji-weizhuanlunkuo-"></span>
            <div class="name">
              PPT
            </div>
            <div class="code-name">.dy-zhongguohangtiantubiaoheji-weizhuanlunkuo-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-"></span>
            <div class="name">
              工业的-2
            </div>
            <div class="code-name">.dy-gongyede-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-1"></span>
            <div class="name">
              工业的-4
            </div>
            <div class="code-name">.dy-gongyede-1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-2"></span>
            <div class="name">
              工业的-38
            </div>
            <div class="code-name">.dy-gongyede-2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-3"></span>
            <div class="name">
              工业的-43
            </div>
            <div class="code-name">.dy-gongyede-3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-4"></span>
            <div class="name">
              工业的-56
            </div>
            <div class="code-name">.dy-gongyede-4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-5"></span>
            <div class="name">
              工业的-63
            </div>
            <div class="code-name">.dy-gongyede-5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-6"></span>
            <div class="name">
              工业的-69
            </div>
            <div class="code-name">.dy-gongyede-6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-7"></span>
            <div class="name">
              工业的-73
            </div>
            <div class="code-name">.dy-gongyede-7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-8"></span>
            <div class="name">
              工业的-79
            </div>
            <div class="code-name">.dy-gongyede-8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyede-9"></span>
            <div class="name">
              工业的-98
            </div>
            <div class="code-name">.dy-gongyede-9
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-wumoxing"></span>
            <div class="name">
              物模型
            </div>
            <div class="code-name">.dy-wumoxing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-renwujincheng"></span>
            <div class="name">
              任务进程
            </div>
            <div class="code-name">.dy-renwujincheng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-xiaoxitongzhi"></span>
            <div class="name">
              消息通知
            </div>
            <div class="code-name">.dy-xiaoxitongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-zhihangfankui"></span>
            <div class="name">
              执行反馈
            </div>
            <div class="code-name">.dy-zhihangfankui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongdanqueren"></span>
            <div class="name">
              工单确认
            </div>
            <div class="code-name">.dy-gongdanqueren
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shanchusekuai"></span>
            <div class="name">
              删除色块
            </div>
            <div class="code-name">.dy-shanchusekuai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-PNG1"></span>
            <div class="name">
              PNG
            </div>
            <div class="code-name">.dy-PNG1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-PPT"></span>
            <div class="name">
              PPT
            </div>
            <div class="code-name">.dy-PPT
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-TEXT"></span>
            <div class="name">
              TEXT
            </div>
            <div class="code-name">.dy-TEXT
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-guandao"></span>
            <div class="name">
              管道
            </div>
            <div class="code-name">.dy-guandao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-guizeyinqing"></span>
            <div class="name">
              规则引擎
            </div>
            <div class="code-name">.dy-guizeyinqing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-jianceqi"></span>
            <div class="name">
              检测器
            </div>
            <div class="code-name">.dy-jianceqi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-liujisuan"></span>
            <div class="name">
              流计算
            </div>
            <div class="code-name">.dy-liujisuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-lianjieliu"></span>
            <div class="name">
              连接流
            </div>
            <div class="code-name">.dy-lianjieliu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shujuwajue"></span>
            <div class="name">
              数据挖掘
            </div>
            <div class="code-name">.dy-shujuwajue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-wangguan"></span>
            <div class="name">
              网关
            </div>
            <div class="code-name">.dy-wangguan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-wuguan"></span>
            <div class="name">
              AI
            </div>
            <div class="code-name">.dy-wuguan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-zhexiantu"></span>
            <div class="name">
              折线图
            </div>
            <div class="code-name">.dy-zhexiantu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shenjing"></span>
            <div class="name">
              神经
            </div>
            <div class="code-name">.dy-shenjing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-fuzhi"></span>
            <div class="name">
              复制
            </div>
            <div class="code-name">.dy-fuzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-drag"></span>
            <div class="name">
              drag
            </div>
            <div class="code-name">.dy-drag
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-ellipsis-vertical"></span>
            <div class="name">
              ellipsis-v
            </div>
            <div class="code-name">.dy-ellipsis-vertical
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gallery-view"></span>
            <div class="name">
              gallery-view
            </div>
            <div class="code-name">.dy-gallery-view
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-WIFI"></span>
            <div class="name">
              WIFI
            </div>
            <div class="code-name">.dy-WIFI
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-bug-report"></span>
            <div class="name">
              bug-report
            </div>
            <div class="code-name">.dy-bug-report
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-qrcode"></span>
            <div class="name">
              qrcode
            </div>
            <div class="code-name">.dy-qrcode
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-scan"></span>
            <div class="name">
              scan
            </div>
            <div class="code-name">.dy-scan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-cut"></span>
            <div class="name">
              cut
            </div>
            <div class="code-name">.dy-cut
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gift"></span>
            <div class="name">
              gift
            </div>
            <div class="code-name">.dy-gift
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-link"></span>
            <div class="name">
              link
            </div>
            <div class="code-name">.dy-link
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-poweroff"></span>
            <div class="name">
              poweroff
            </div>
            <div class="code-name">.dy-poweroff
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-key"></span>
            <div class="name">
              key
            </div>
            <div class="code-name">.dy-key
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-safety-certificate"></span>
            <div class="name">
              safety-certificate
            </div>
            <div class="code-name">.dy-safety-certificate
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-supervise"></span>
            <div class="name">
              supervise
            </div>
            <div class="code-name">.dy-supervise
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tag-subscipt"></span>
            <div class="name">
              tag-subscipt
            </div>
            <div class="code-name">.dy-tag-subscipt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-chart-pie-alt"></span>
            <div class="name">
              chart-pie-alt
            </div>
            <div class="code-name">.dy-chart-pie-alt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-chart-relation"></span>
            <div class="name">
              chart-relation
            </div>
            <div class="code-name">.dy-chart-relation
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-chart-scatter-plot"></span>
            <div class="name">
              chart-scatter-plot
            </div>
            <div class="code-name">.dy-chart-scatter-plot
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-chart-area"></span>
            <div class="name">
              chart-area
            </div>
            <div class="code-name">.dy-chart-area
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-chart-line"></span>
            <div class="name">
              chart-line
            </div>
            <div class="code-name">.dy-chart-line
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-chart-bar"></span>
            <div class="name">
              chart-bar
            </div>
            <div class="code-name">.dy-chart-bar
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-display-code"></span>
            <div class="name">
              display-code
            </div>
            <div class="code-name">.dy-display-code
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-display-arrow-right"></span>
            <div class="name">
              display-arrow-right
            </div>
            <div class="code-name">.dy-display-arrow-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-display-arrow-left"></span>
            <div class="name">
              display-arrow-left
            </div>
            <div class="code-name">.dy-display-arrow-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-laptop-error"></span>
            <div class="name">
              laptop-error
            </div>
            <div class="code-name">.dy-laptop-error
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-laptop-check"></span>
            <div class="name">
              laptop-check
            </div>
            <div class="code-name">.dy-laptop-check
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-laptop"></span>
            <div class="name">
              laptop
            </div>
            <div class="code-name">.dy-laptop
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-mobile-error"></span>
            <div class="name">
              mobile-error
            </div>
            <div class="code-name">.dy-mobile-error
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-mobile-check"></span>
            <div class="name">
              mobile-check
            </div>
            <div class="code-name">.dy-mobile-check
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-mobile-alt"></span>
            <div class="name">
              mobile-alt
            </div>
            <div class="code-name">.dy-mobile-alt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-aliwangwang"></span>
            <div class="name">
              aliwangwang
            </div>
            <div class="code-name">.dy-aliwangwang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-nail"></span>
            <div class="name">
              nail
            </div>
            <div class="code-name">.dy-nail
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-nail-fixed"></span>
            <div class="name">
              nail-fixed
            </div>
            <div class="code-name">.dy-nail-fixed
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-edit"></span>
            <div class="name">
              edit
            </div>
            <div class="code-name">.dy-edit
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-dollar"></span>
            <div class="name">
              dollar
            </div>
            <div class="code-name">.dy-dollar
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-transanction"></span>
            <div class="name">
              transanction
            </div>
            <div class="code-name">.dy-transanction
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-filter-fill"></span>
            <div class="name">
              filter-fill
            </div>
            <div class="code-name">.dy-filter-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-all-fill"></span>
            <div class="name">
              all-fill
            </div>
            <div class="code-name">.dy-all-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-databaseplus-fill"></span>
            <div class="name">
              database plus-fill
            </div>
            <div class="code-name">.dy-databaseplus-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-database-fill"></span>
            <div class="name">
              database-fill
            </div>
            <div class="code-name">.dy-database-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-commentlines-fill"></span>
            <div class="name">
              comment lines-fill
            </div>
            <div class="code-name">.dy-commentlines-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-commentdots-fill"></span>
            <div class="name">
              comment dots-fill
            </div>
            <div class="code-name">.dy-commentdots-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-paperplane-fill"></span>
            <div class="name">
              paper plane-fill
            </div>
            <div class="code-name">.dy-paperplane-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-eyeslash-fill"></span>
            <div class="name">
              eye slash-fill
            </div>
            <div class="code-name">.dy-eyeslash-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-eye-fill"></span>
            <div class="name">
              eye-fill
            </div>
            <div class="code-name">.dy-eye-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-lightbulb-fill"></span>
            <div class="name">
              lightbulb-fill
            </div>
            <div class="code-name">.dy-lightbulb-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-flag-fill"></span>
            <div class="name">
              flag-fill
            </div>
            <div class="code-name">.dy-flag-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tag-fill"></span>
            <div class="name">
              tag-fill
            </div>
            <div class="code-name">.dy-tag-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-position-fill"></span>
            <div class="name">
              position-fill
            </div>
            <div class="code-name">.dy-position-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-location-fill"></span>
            <div class="name">
              location-fill
            </div>
            <div class="code-name">.dy-location-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-map-fill"></span>
            <div class="name">
              map-fill
            </div>
            <div class="code-name">.dy-map-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-inboxin-fill"></span>
            <div class="name">
              inbox in-fill
            </div>
            <div class="code-name">.dy-inboxin-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-box-fill"></span>
            <div class="name">
              box-fill
            </div>
            <div class="code-name">.dy-box-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-databaseset-fill"></span>
            <div class="name">
              database set-fill
            </div>
            <div class="code-name">.dy-databaseset-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-layergroup-fill"></span>
            <div class="name">
              layer group-fill
            </div>
            <div class="code-name">.dy-layergroup-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-cry-fill"></span>
            <div class="name">
              cry-fill
            </div>
            <div class="code-name">.dy-cry-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-smile-fill"></span>
            <div class="name">
              smile-fill
            </div>
            <div class="code-name">.dy-smile-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-unlock-fill"></span>
            <div class="name">
              unlock-fill
            </div>
            <div class="code-name">.dy-unlock-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-lock-fill"></span>
            <div class="name">
              lock-fill
            </div>
            <div class="code-name">.dy-lock-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-alignright-fill"></span>
            <div class="name">
              align right-fill
            </div>
            <div class="code-name">.dy-alignright-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-alignleft-fill"></span>
            <div class="name">
              align left-fill
            </div>
            <div class="code-name">.dy-alignleft-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-borderbottom-fill"></span>
            <div class="name">
              border bottom-fill
            </div>
            <div class="code-name">.dy-borderbottom-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-bordertop-fill"></span>
            <div class="name">
              border top-fill
            </div>
            <div class="code-name">.dy-bordertop-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-aligncenter-fill"></span>
            <div class="name">
              align center-fill
            </div>
            <div class="code-name">.dy-aligncenter-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-borderverticle-fill"></span>
            <div class="name">
              border verticle-fill
            </div>
            <div class="code-name">.dy-borderverticle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-piccenter-fill"></span>
            <div class="name">
              pic center-fill
            </div>
            <div class="code-name">.dy-piccenter-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-picside-fill"></span>
            <div class="name">
              pic side-fill
            </div>
            <div class="code-name">.dy-picside-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-folderopen-fill"></span>
            <div class="name">
              folder open-fill
            </div>
            <div class="code-name">.dy-folderopen-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-folderplus-fill"></span>
            <div class="name">
              folder plus-fill
            </div>
            <div class="code-name">.dy-folderplus-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-folder-fill"></span>
            <div class="name">
              folder-fill
            </div>
            <div class="code-name">.dy-folder-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-file-SQL"></span>
            <div class="name">
              file-SQL
            </div>
            <div class="code-name">.dy-file-SQL
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-fileplus-fill"></span>
            <div class="name">
              file plus-fill
            </div>
            <div class="code-name">.dy-fileplus-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-file-fill"></span>
            <div class="name">
              file-fill
            </div>
            <div class="code-name">.dy-file-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-copy-fill"></span>
            <div class="name">
              copy-fill
            </div>
            <div class="code-name">.dy-copy-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-headset-fill"></span>
            <div class="name">
              headset-fill
            </div>
            <div class="code-name">.dy-headset-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-phone-fill"></span>
            <div class="name">
              phone-fill
            </div>
            <div class="code-name">.dy-phone-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-pausecircle-fill"></span>
            <div class="name">
              pause circle-fill
            </div>
            <div class="code-name">.dy-pausecircle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-stopcircle-fill"></span>
            <div class="name">
              stop circle-fill
            </div>
            <div class="code-name">.dy-stopcircle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-playcircle-fill"></span>
            <div class="name">
              play circle-fill
            </div>
            <div class="code-name">.dy-playcircle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-delete-fill"></span>
            <div class="name">
              delete-fill
            </div>
            <div class="code-name">.dy-delete-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-picture-fill"></span>
            <div class="name">
              picture-fill
            </div>
            <div class="code-name">.dy-picture-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-mail-fill"></span>
            <div class="name">
              mail-fill
            </div>
            <div class="code-name">.dy-mail-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-heart-fill"></span>
            <div class="name">
              heart-fill
            </div>
            <div class="code-name">.dy-heart-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-collection-fill"></span>
            <div class="name">
              collection-fill
            </div>
            <div class="code-name">.dy-collection-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-user-group-fill"></span>
            <div class="name">
              user-group-fill
            </div>
            <div class="code-name">.dy-user-group-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-userplus-fill"></span>
            <div class="name">
              user plus-fill
            </div>
            <div class="code-name">.dy-userplus-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-user-fill"></span>
            <div class="name">
              user-fill
            </div>
            <div class="code-name">.dy-user-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-cog-fill"></span>
            <div class="name">
              cog-fill
            </div>
            <div class="code-name">.dy-cog-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-clock-fill"></span>
            <div class="name">
              clock-fill
            </div>
            <div class="code-name">.dy-clock-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-calendaralt-fill"></span>
            <div class="name">
              calendar alt-fill
            </div>
            <div class="code-name">.dy-calendaralt-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-clouddownload-fill"></span>
            <div class="name">
              cloud download-fill
            </div>
            <div class="code-name">.dy-clouddownload-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-cloudupload-fill"></span>
            <div class="name">
              cloud upload-fill
            </div>
            <div class="code-name">.dy-cloudupload-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-exchange-fill"></span>
            <div class="name">
              exchange-fill
            </div>
            <div class="code-name">.dy-exchange-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-info-circle-fill"></span>
            <div class="name">
              info-circle-fill
            </div>
            <div class="code-name">.dy-info-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-question-circle-fill"></span>
            <div class="name">
              question-circle-fill
            </div>
            <div class="code-name">.dy-question-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-exclamationcircle-f"></span>
            <div class="name">
              exclamation circle-f
            </div>
            <div class="code-name">.dy-exclamationcircle-f
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-minus-circle-fill"></span>
            <div class="name">
              minus-circle-fill
            </div>
            <div class="code-name">.dy-minus-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-plus-circle-fill"></span>
            <div class="name">
              plus-circle-fill
            </div>
            <div class="code-name">.dy-plus-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-times-circle-fill"></span>
            <div class="name">
              times-circle-fill
            </div>
            <div class="code-name">.dy-times-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-check-circle-fill"></span>
            <div class="name">
              check-circle-fill
            </div>
            <div class="code-name">.dy-check-circle-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-compressalt-fill"></span>
            <div class="name">
              compress alt-fill
            </div>
            <div class="code-name">.dy-compressalt-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-expandalt-fill"></span>
            <div class="name">
              expand alt-fill
            </div>
            <div class="code-name">.dy-expandalt-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-filter"></span>
            <div class="name">
              filter
            </div>
            <div class="code-name">.dy-filter
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-all"></span>
            <div class="name">
              all
            </div>
            <div class="code-name">.dy-all
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-database-plus"></span>
            <div class="name">
              database-plus
            </div>
            <div class="code-name">.dy-database-plus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-database"></span>
            <div class="name">
              database
            </div>
            <div class="code-name">.dy-database
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-comment-lines"></span>
            <div class="name">
              comment-lines
            </div>
            <div class="code-name">.dy-comment-lines
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-comment-dots"></span>
            <div class="name">
              comment-dots
            </div>
            <div class="code-name">.dy-comment-dots
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-paper-plane"></span>
            <div class="name">
              paper-plane
            </div>
            <div class="code-name">.dy-paper-plane
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-eye-slash"></span>
            <div class="name">
              eye-slash
            </div>
            <div class="code-name">.dy-eye-slash
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-eye"></span>
            <div class="name">
              eye
            </div>
            <div class="code-name">.dy-eye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-lightbulb"></span>
            <div class="name">
              lightbulb
            </div>
            <div class="code-name">.dy-lightbulb
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-flag"></span>
            <div class="name">
              flag
            </div>
            <div class="code-name">.dy-flag
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tag"></span>
            <div class="name">
              tag
            </div>
            <div class="code-name">.dy-tag
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-position"></span>
            <div class="name">
              position
            </div>
            <div class="code-name">.dy-position
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-location"></span>
            <div class="name">
              location
            </div>
            <div class="code-name">.dy-location
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-map"></span>
            <div class="name">
              map
            </div>
            <div class="code-name">.dy-map
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-inbox-in"></span>
            <div class="name">
              inbox-in
            </div>
            <div class="code-name">.dy-inbox-in
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-box"></span>
            <div class="name">
              box
            </div>
            <div class="code-name">.dy-box
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-database-set"></span>
            <div class="name">
              database-set
            </div>
            <div class="code-name">.dy-database-set
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-layer-group"></span>
            <div class="name">
              layer-group
            </div>
            <div class="code-name">.dy-layer-group
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-wind-cry"></span>
            <div class="name">
              wind-cry
            </div>
            <div class="code-name">.dy-wind-cry
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-wind-smile"></span>
            <div class="name">
              wind-smile
            </div>
            <div class="code-name">.dy-wind-smile
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-unlock"></span>
            <div class="name">
              unlock
            </div>
            <div class="code-name">.dy-unlock
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-lock"></span>
            <div class="name">
              lock
            </div>
            <div class="code-name">.dy-lock
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-align-right"></span>
            <div class="name">
              align-right
            </div>
            <div class="code-name">.dy-align-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-align-left"></span>
            <div class="name">
              align-left
            </div>
            <div class="code-name">.dy-align-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-border-bottom"></span>
            <div class="name">
              border-bottom
            </div>
            <div class="code-name">.dy-border-bottom
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-border-top"></span>
            <div class="name">
              border-top
            </div>
            <div class="code-name">.dy-border-top
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-align-center"></span>
            <div class="name">
              align-center
            </div>
            <div class="code-name">.dy-align-center
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-border-verticle"></span>
            <div class="name">
              border-verticle
            </div>
            <div class="code-name">.dy-border-verticle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-pic-center"></span>
            <div class="name">
              pic-center
            </div>
            <div class="code-name">.dy-pic-center
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-pic-side"></span>
            <div class="name">
              pic-side
            </div>
            <div class="code-name">.dy-pic-side
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-folder-open"></span>
            <div class="name">
              folder-open
            </div>
            <div class="code-name">.dy-folder-open
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-folder-plus"></span>
            <div class="name">
              folder-plus
            </div>
            <div class="code-name">.dy-folder-plus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-folder"></span>
            <div class="name">
              folder
            </div>
            <div class="code-name">.dy-folder
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-file-SQL1"></span>
            <div class="name">
              file-SQL
            </div>
            <div class="code-name">.dy-file-SQL1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-file-plus"></span>
            <div class="name">
              file-plus
            </div>
            <div class="code-name">.dy-file-plus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-file"></span>
            <div class="name">
              file
            </div>
            <div class="code-name">.dy-file
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-copy"></span>
            <div class="name">
              copy
            </div>
            <div class="code-name">.dy-copy
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-headset"></span>
            <div class="name">
              headset
            </div>
            <div class="code-name">.dy-headset
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-phone"></span>
            <div class="name">
              phone
            </div>
            <div class="code-name">.dy-phone
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-pausecircle"></span>
            <div class="name">
              pause circle
            </div>
            <div class="code-name">.dy-pausecircle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-stopcircle"></span>
            <div class="name">
              stop circle
            </div>
            <div class="code-name">.dy-stopcircle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-playcircle"></span>
            <div class="name">
              play circle
            </div>
            <div class="code-name">.dy-playcircle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-delete"></span>
            <div class="name">
              delete
            </div>
            <div class="code-name">.dy-delete
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-picture"></span>
            <div class="name">
              picture
            </div>
            <div class="code-name">.dy-picture
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-mail"></span>
            <div class="name">
              mail
            </div>
            <div class="code-name">.dy-mail
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-like"></span>
            <div class="name">
              like
            </div>
            <div class="code-name">.dy-like
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-collection"></span>
            <div class="name">
              collection
            </div>
            <div class="code-name">.dy-collection
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-user-group"></span>
            <div class="name">
              user-group
            </div>
            <div class="code-name">.dy-user-group
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-account-plus"></span>
            <div class="name">
              account-plus
            </div>
            <div class="code-name">.dy-account-plus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-account"></span>
            <div class="name">
              account
            </div>
            <div class="code-name">.dy-account
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-cog"></span>
            <div class="name">
              cog
            </div>
            <div class="code-name">.dy-cog
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-clock"></span>
            <div class="name">
              clock
            </div>
            <div class="code-name">.dy-clock
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-calendar-alt"></span>
            <div class="name">
              calendar-alt
            </div>
            <div class="code-name">.dy-calendar-alt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-clouddownload"></span>
            <div class="name">
              cloud download
            </div>
            <div class="code-name">.dy-clouddownload
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-cloudupload"></span>
            <div class="name">
              cloud upload
            </div>
            <div class="code-name">.dy-cloudupload
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-exchange"></span>
            <div class="name">
              exchange
            </div>
            <div class="code-name">.dy-exchange
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-info-circle"></span>
            <div class="name">
              info-circle
            </div>
            <div class="code-name">.dy-info-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-question-circle"></span>
            <div class="name">
              question-circle
            </div>
            <div class="code-name">.dy-question-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-exclamation-circle"></span>
            <div class="name">
              exclamation-circle
            </div>
            <div class="code-name">.dy-exclamation-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-minus-circle"></span>
            <div class="name">
              minus-circle
            </div>
            <div class="code-name">.dy-minus-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-plus-circle"></span>
            <div class="name">
              plus-circle
            </div>
            <div class="code-name">.dy-plus-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-times-circle"></span>
            <div class="name">
              times-circle
            </div>
            <div class="code-name">.dy-times-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-check-circle"></span>
            <div class="name">
              check-circle
            </div>
            <div class="code-name">.dy-check-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-compress-alt"></span>
            <div class="name">
              compress-alt
            </div>
            <div class="code-name">.dy-compress-alt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-expand-alt"></span>
            <div class="name">
              expand-alt
            </div>
            <div class="code-name">.dy-expand-alt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-ban"></span>
            <div class="name">
              ban
            </div>
            <div class="code-name">.dy-ban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-minus"></span>
            <div class="name">
              minus
            </div>
            <div class="code-name">.dy-minus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-plus"></span>
            <div class="name">
              plus
            </div>
            <div class="code-name">.dy-plus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-times"></span>
            <div class="name">
              times
            </div>
            <div class="code-name">.dy-times
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-check"></span>
            <div class="name">
              check
            </div>
            <div class="code-name">.dy-check
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-search-minus"></span>
            <div class="name">
              search-minus
            </div>
            <div class="code-name">.dy-search-minus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-search-plus"></span>
            <div class="name">
              search-plus
            </div>
            <div class="code-name">.dy-search-plus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-search"></span>
            <div class="name">
              search
            </div>
            <div class="code-name">.dy-search
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-reply"></span>
            <div class="name">
              reply
            </div>
            <div class="code-name">.dy-reply
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-undo"></span>
            <div class="name">
              undo
            </div>
            <div class="code-name">.dy-undo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-redo"></span>
            <div class="name">
              redo
            </div>
            <div class="code-name">.dy-redo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-external-link"></span>
            <div class="name">
              external-link
            </div>
            <div class="code-name">.dy-external-link
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrows-alt"></span>
            <div class="name">
              arrows-alt
            </div>
            <div class="code-name">.dy-arrows-alt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-indent"></span>
            <div class="name">
              indent
            </div>
            <div class="code-name">.dy-indent
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-outdent"></span>
            <div class="name">
              outdent
            </div>
            <div class="code-name">.dy-outdent
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-sort-line"></span>
            <div class="name">
              sort-line
            </div>
            <div class="code-name">.dy-sort-line
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-switch"></span>
            <div class="name">
              switch
            </div>
            <div class="code-name">.dy-switch
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-wind-descending"></span>
            <div class="name">
              wind-descending
            </div>
            <div class="code-name">.dy-wind-descending
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-wind-ascending"></span>
            <div class="name">
              wind-ascending
            </div>
            <div class="code-name">.dy-wind-ascending
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-download"></span>
            <div class="name">
              download
            </div>
            <div class="code-name">.dy-download
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-upload"></span>
            <div class="name">
              upload
            </div>
            <div class="code-name">.dy-upload
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrow-to-bottom"></span>
            <div class="name">
              arrow-to-bottom
            </div>
            <div class="code-name">.dy-arrow-to-bottom
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrow-to-top"></span>
            <div class="name">
              arrow-to-top
            </div>
            <div class="code-name">.dy-arrow-to-top
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-long-arrow-down"></span>
            <div class="name">
              long-arrow-down
            </div>
            <div class="code-name">.dy-long-arrow-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-long-arrow-up"></span>
            <div class="name">
              long-arrow-up
            </div>
            <div class="code-name">.dy-long-arrow-up
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrow-right"></span>
            <div class="name">
              arrow-right
            </div>
            <div class="code-name">.dy-arrow-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrow-left"></span>
            <div class="name">
              arrow-left
            </div>
            <div class="code-name">.dy-arrow-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-sort"></span>
            <div class="name">
              sort
            </div>
            <div class="code-name">.dy-sort
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-sort-down"></span>
            <div class="name">
              sort-down
            </div>
            <div class="code-name">.dy-sort-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-sort-up"></span>
            <div class="name">
              sort-up
            </div>
            <div class="code-name">.dy-sort-up
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-caret-right"></span>
            <div class="name">
              caret-right
            </div>
            <div class="code-name">.dy-caret-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-caret-left"></span>
            <div class="name">
              caret-left
            </div>
            <div class="code-name">.dy-caret-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrows-v"></span>
            <div class="name">
              arrows-v
            </div>
            <div class="code-name">.dy-arrows-v
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-angle-double-down"></span>
            <div class="name">
              angle- double-down
            </div>
            <div class="code-name">.dy-angle-double-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-angle-double-up"></span>
            <div class="name">
              angle-double-up
            </div>
            <div class="code-name">.dy-angle-double-up
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-angle-double-right"></span>
            <div class="name">
              angle-double-right
            </div>
            <div class="code-name">.dy-angle-double-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-angle-double-left"></span>
            <div class="name">
              angle-double-left
            </div>
            <div class="code-name">.dy-angle-double-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-angle-down"></span>
            <div class="name">
              angle-down
            </div>
            <div class="code-name">.dy-angle-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-angle-up"></span>
            <div class="name">
              angle-up
            </div>
            <div class="code-name">.dy-angle-up
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-angle-right"></span>
            <div class="name">
              angle-right
            </div>
            <div class="code-name">.dy-angle-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-angle-left"></span>
            <div class="name">
              angle-left
            </div>
            <div class="code-name">.dy-angle-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-CADshezhi"></span>
            <div class="name">
              CAD设置2
            </div>
            <div class="code-name">.dy-CADshezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-paperclip"></span>
            <div class="name">
              paperclip
            </div>
            <div class="code-name">.dy-paperclip
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-CADshezhi-copy"></span>
            <div class="name">
              CAD设置2_相反
            </div>
            <div class="code-name">.dy-CADshezhi-copy
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-connection"></span>
            <div class="name">
              connection
            </div>
            <div class="code-name">.dy-connection
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-training"></span>
            <div class="name">
              training
            </div>
            <div class="code-name">.dy-training
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-process"></span>
            <div class="name">
              process
            </div>
            <div class="code-name">.dy-process
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-news"></span>
            <div class="name">
              news
            </div>
            <div class="code-name">.dy-news
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-save"></span>
            <div class="name">
              save
            </div>
            <div class="code-name">.dy-save
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-print"></span>
            <div class="name">
              print
            </div>
            <div class="code-name">.dy-print
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-new-releases"></span>
            <div class="name">
              new-releases
            </div>
            <div class="code-name">.dy-new-releases
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-release"></span>
            <div class="name">
              release
            </div>
            <div class="code-name">.dy-release
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-alert"></span>
            <div class="name">
              alert
            </div>
            <div class="code-name">.dy-alert
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-backspace"></span>
            <div class="name">
              backspace
            </div>
            <div class="code-name">.dy-backspace
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gem"></span>
            <div class="name">
              gem
            </div>
            <div class="code-name">.dy-gem
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-integral"></span>
            <div class="name">
              integral
            </div>
            <div class="code-name">.dy-integral
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-star-circle"></span>
            <div class="name">
              star-circle
            </div>
            <div class="code-name">.dy-star-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-user-circle"></span>
            <div class="name">
              user-circle
            </div>
            <div class="code-name">.dy-user-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-cloud-machine-fill"></span>
            <div class="name">
              cloud-machine-fill
            </div>
            <div class="code-name">.dy-cloud-machine-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-cloud-machine"></span>
            <div class="name">
              cloud-machine
            </div>
            <div class="code-name">.dy-cloud-machine
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-terminal-fill"></span>
            <div class="name">
              terminal-fill
            </div>
            <div class="code-name">.dy-terminal-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-terminal"></span>
            <div class="name">
              terminal
            </div>
            <div class="code-name">.dy-terminal
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shopping-cart-fill"></span>
            <div class="name">
              shopping-cart-fill
            </div>
            <div class="code-name">.dy-shopping-cart-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-iframetianjia"></span>
            <div class="name">
              iframe添加
            </div>
            <div class="code-name">.dy-iframetianjia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tupiantianjia"></span>
            <div class="name">
              图片添加
            </div>
            <div class="code-name">.dy-tupiantianjia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-resource"></span>
            <div class="name">
              resource
            </div>
            <div class="code-name">.dy-resource
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-wind-loading"></span>
            <div class="name">
              wind-loading
            </div>
            <div class="code-name">.dy-wind-loading
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-rank"></span>
            <div class="name">
              rank
            </div>
            <div class="code-name">.dy-rank
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-zitiyanse"></span>
            <div class="name">
              字体颜色
            </div>
            <div class="code-name">.dy-zitiyanse
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-sync-alt"></span>
            <div class="name">
              sync-alt
            </div>
            <div class="code-name">.dy-sync-alt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-compass"></span>
            <div class="name">
              compass
            </div>
            <div class="code-name">.dy-compass
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrow-alt-from-top"></span>
            <div class="name">
              arrow-alt- from-top
            </div>
            <div class="code-name">.dy-arrow-alt-from-top
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrow-alt-from-botto"></span>
            <div class="name">
              arrow-alt-from-botto
            </div>
            <div class="code-name">.dy-arrow-alt-from-botto
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-menu"></span>
            <div class="name">
              menu
            </div>
            <div class="code-name">.dy-menu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-excel"></span>
            <div class="name">
              excel
            </div>
            <div class="code-name">.dy-excel
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shebeikaifa"></span>
            <div class="name">
              设备开发
            </div>
            <div class="code-name">.dy-shebeikaifa
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-icon-drag"></span>
            <div class="name">
              icon-drag
            </div>
            <div class="code-name">.dy-icon-drag
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-early-warning"></span>
            <div class="name">
              early-warning
            </div>
            <div class="code-name">.dy-early-warning
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-share"></span>
            <div class="name">
              share
            </div>
            <div class="code-name">.dy-share
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-share1"></span>
            <div class="name">
              share
            </div>
            <div class="code-name">.dy-share1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-Png"></span>
            <div class="name">
              Png
            </div>
            <div class="code-name">.dy-Png
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-Jpg"></span>
            <div class="name">
              Jpg
            </div>
            <div class="code-name">.dy-Jpg
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-Pdf"></span>
            <div class="name">
              Pdf
            </div>
            <div class="code-name">.dy-Pdf
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-doc2"></span>
            <div class="name">
              doc
            </div>
            <div class="code-name">.dy-doc2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-img1"></span>
            <div class="name">
              img
            </div>
            <div class="code-name">.dy-img1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-Excel1"></span>
            <div class="name">
              Excel
            </div>
            <div class="code-name">.dy-Excel1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-management-"></span>
            <div class="name">
              management
            </div>
            <div class="code-name">.dy-management-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-accesskeys"></span>
            <div class="name">
              accesskeys
            </div>
            <div class="code-name">.dy-accesskeys
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-zhunbeiliangchan"></span>
            <div class="name">
              准备量产
            </div>
            <div class="code-name">.dy-zhunbeiliangchan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tianjiazituzhi-"></span>
            <div class="name">
              添加子图纸
            </div>
            <div class="code-name">.dy-tianjiazituzhi-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-document1"></span>
            <div class="name">
              document
            </div>
            <div class="code-name">.dy-document1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-Textfile"></span>
            <div class="name">
              Text file 1
            </div>
            <div class="code-name">.dy-Textfile
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-CADshezhi1"></span>
            <div class="name">
              CAD设置
            </div>
            <div class="code-name">.dy-CADshezhi1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-arrow-sortdown-smal"></span>
            <div class="name">
              arrow-sort down-small
            </div>
            <div class="code-name">.dy-arrow-sortdown-smal
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-minus-square-fill"></span>
            <div class="name">
              minus-square-fill
            </div>
            <div class="code-name">.dy-minus-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-plus-square-fill"></span>
            <div class="name">
              plus-square-fill
            </div>
            <div class="code-name">.dy-plus-square-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-minus-square"></span>
            <div class="name">
              minus-square
            </div>
            <div class="code-name">.dy-minus-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-plus-square"></span>
            <div class="name">
              plus-square
            </div>
            <div class="code-name">.dy-plus-square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-stepmode"></span>
            <div class="name">
              step mode
            </div>
            <div class="code-name">.dy-stepmode
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-scrollingmode"></span>
            <div class="name">
              scrolling mode
            </div>
            <div class="code-name">.dy-scrollingmode
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-kongjianxuanzhong"></span>
            <div class="name">
              控件选中
            </div>
            <div class="code-name">.dy-kongjianxuanzhong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-excel-"></span>
            <div class="name">
              excel-01
            </div>
            <div class="code-name">.dy-excel-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-shoppingcart"></span>
            <div class="name">
              shopping cart
            </div>
            <div class="code-name">.dy-shoppingcart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-Excel2"></span>
            <div class="name">
              Excel
            </div>
            <div class="code-name">.dy-Excel2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-waiting-fill"></span>
            <div class="name">
              waiting-fill
            </div>
            <div class="code-name">.dy-waiting-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-waiting"></span>
            <div class="name">
              waiting
            </div>
            <div class="code-name">.dy-waiting
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-right-arrow-rect"></span>
            <div class="name">
              right-arrow-rect
            </div>
            <div class="code-name">.dy-right-arrow-rect
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-left-arrow-rect"></span>
            <div class="name">
              left-arrow-rect
            </div>
            <div class="code-name">.dy-left-arrow-rect
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-gongyejichulingjian"></span>
            <div class="name">
              工业基础零件
            </div>
            <div class="code-name">.dy-gongyejichulingjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tubiao_daochuCAD"></span>
            <div class="name">
              导出CAD
            </div>
            <div class="code-name">.dy-tubiao_daochuCAD
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-tubiao_daoruCAD"></span>
            <div class="name">
              导入CAD
            </div>
            <div class="code-name">.dy-tubiao_daoruCAD
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-bell"></span>
            <div class="name">
              bell
            </div>
            <div class="code-name">.dy-bell
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-jiegouhuashuju"></span>
            <div class="name">
              structured data
            </div>
            <div class="code-name">.dy-jiegouhuashuju
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-xiangliang"></span>
            <div class="name">
              vector
            </div>
            <div class="code-name">.dy-xiangliang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-jpg1"></span>
            <div class="name">
              jpg
            </div>
            <div class="code-name">.dy-jpg1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-NEW-copy"></span>
            <div class="name">
              NEW
            </div>
            <div class="code-name">.dy-NEW-copy
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-HOT-copy"></span>
            <div class="name">
              HOT
            </div>
            <div class="code-name">.dy-HOT-copy
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-xitong-jiaosepeizhi"></span>
            <div class="name">
              系统-角色配置
            </div>
            <div class="code-name">.dy-xitong-jiaosepeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-ppt2"></span>
            <div class="name">
              ppt
            </div>
            <div class="code-name">.dy-ppt2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont dy-png"></span>
            <div class="name">
              png
            </div>
            <div class="code-name">.dy-png
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont dy-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-pdf"></use>
                </svg>
                <div class="name">pdf</div>
                <div class="code-name">#dy-pdf</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-img"></use>
                </svg>
                <div class="name">img</div>
                <div class="code-name">#dy-img</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongye40"></use>
                </svg>
                <div class="name">工业4.0</div>
                <div class="code-name">#dy-gongye40</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-jpg"></use>
                </svg>
                <div class="name">jpg</div>
                <div class="code-name">#dy-jpg</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-doc"></use>
                </svg>
                <div class="name">doc</div>
                <div class="code-name">#dy-doc</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-text"></use>
                </svg>
                <div class="name">text</div>
                <div class="code-name">#dy-text</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-pdf1"></use>
                </svg>
                <div class="name">pdf</div>
                <div class="code-name">#dy-pdf1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tuzhi"></use>
                </svg>
                <div class="name">图纸 (2)</div>
                <div class="code-name">#dy-tuzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-icon-book"></use>
                </svg>
                <div class="name">图纸</div>
                <div class="code-name">#dy-icon-book</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyesheshi"></use>
                </svg>
                <div class="name">工业设施</div>
                <div class="code-name">#dy-gongyesheshi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-lingjian"></use>
                </svg>
                <div class="name">零件</div>
                <div class="code-name">#dy-lingjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tiaoshi"></use>
                </svg>
                <div class="name">调试</div>
                <div class="code-name">#dy-tiaoshi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-changjingguanli"></use>
                </svg>
                <div class="name">场景管理</div>
                <div class="code-name">#dy-changjingguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-bianji"></use>
                </svg>
                <div class="name">编辑</div>
                <div class="code-name">#dy-bianji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-guanlianshebei"></use>
                </svg>
                <div class="name">关联设备</div>
                <div class="code-name">#dy-guanlianshebei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-guanfangbanben"></use>
                </svg>
                <div class="name">官方版本</div>
                <div class="code-name">#dy-guanfangbanben</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongnengdingyi"></use>
                </svg>
                <div class="name">功能定义</div>
                <div class="code-name">#dy-gongnengdingyi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-jichuguanli"></use>
                </svg>
                <div class="name">基础管理</div>
                <div class="code-name">#dy-jichuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-jishufuwu"></use>
                </svg>
                <div class="name">技术服务</div>
                <div class="code-name">#dy-jishufuwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-hezuohuobanmiyueguanli"></use>
                </svg>
                <div class="name">合作伙伴密钥管理</div>
                <div class="code-name">#dy-hezuohuobanmiyueguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-renjijiaohu"></use>
                </svg>
                <div class="name">人机交互</div>
                <div class="code-name">#dy-renjijiaohu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shiyongwendang"></use>
                </svg>
                <div class="name">使用文档</div>
                <div class="code-name">#dy-shiyongwendang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-quanxianshenpi"></use>
                </svg>
                <div class="name">权限审批</div>
                <div class="code-name">#dy-quanxianshenpi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-yishouquan"></use>
                </svg>
                <div class="name">已授权</div>
                <div class="code-name">#dy-yishouquan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tianshenpi"></use>
                </svg>
                <div class="name">提案审批</div>
                <div class="code-name">#dy-tianshenpi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shujukanban"></use>
                </svg>
                <div class="name">数据看板</div>
                <div class="code-name">#dy-shujukanban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-yibiaopan"></use>
                </svg>
                <div class="name">仪表盘</div>
                <div class="code-name">#dy-yibiaopan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-zhanghaoquanxianguanli"></use>
                </svg>
                <div class="name">账号权限管理</div>
                <div class="code-name">#dy-zhanghaoquanxianguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-yuanquyunwei"></use>
                </svg>
                <div class="name">园区运维</div>
                <div class="code-name">#dy-yuanquyunwei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-jizhanguanli"></use>
                </svg>
                <div class="name">基站管理</div>
                <div class="code-name">#dy-jizhanguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-doc1"></use>
                </svg>
                <div class="name">doc</div>
                <div class="code-name">#dy-doc1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-ppt"></use>
                </svg>
                <div class="name">ppt</div>
                <div class="code-name">#dy-ppt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-pdf2"></use>
                </svg>
                <div class="name">pdf</div>
                <div class="code-name">#dy-pdf2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-icon_bangzhuwendang"></use>
                </svg>
                <div class="name">icon_帮助文档</div>
                <div class="code-name">#dy-icon_bangzhuwendang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-biaodanzujian-biaoge"></use>
                </svg>
                <div class="name">表单组件-表格</div>
                <div class="code-name">#dy-biaodanzujian-biaoge</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-biaodanzujian-xialakuang"></use>
                </svg>
                <div class="name">表单组件-下拉框</div>
                <div class="code-name">#dy-biaodanzujian-xialakuang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyezujian-yibiaopan"></use>
                </svg>
                <div class="name">工业组件-仪表盘</div>
                <div class="code-name">#dy-gongyezujian-yibiaopan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyezujian-zhishideng"></use>
                </svg>
                <div class="name">工业组件-指示灯</div>
                <div class="code-name">#dy-gongyezujian-zhishideng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-xingzhuang-juxing"></use>
                </svg>
                <div class="name">形状-矩形</div>
                <div class="code-name">#dy-xingzhuang-juxing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyezujian-kaiguan"></use>
                </svg>
                <div class="name">工业组件-开关</div>
                <div class="code-name">#dy-gongyezujian-kaiguan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-jishufuwu1"></use>
                </svg>
                <div class="name">技术服务</div>
                <div class="code-name">#dy-jishufuwu1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-yunyingzhongxin"></use>
                </svg>
                <div class="name">运营中心</div>
                <div class="code-name">#dy-yunyingzhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-yunyingguanli"></use>
                </svg>
                <div class="name">运营管理</div>
                <div class="code-name">#dy-yunyingguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-zuzhixiaxia"></use>
                </svg>
                <div class="name">组织下辖</div>
                <div class="code-name">#dy-zuzhixiaxia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-zuzhiqunzu"></use>
                </svg>
                <div class="name">组织群组</div>
                <div class="code-name">#dy-zuzhiqunzu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-dakai"></use>
                </svg>
                <div class="name">打开</div>
                <div class="code-name">#dy-dakai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-JPG"></use>
                </svg>
                <div class="name">JPG</div>
                <div class="code-name">#dy-JPG</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-PDF"></use>
                </svg>
                <div class="name">PDF</div>
                <div class="code-name">#dy-PDF</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy--zhongdaweixian"></use>
                </svg>
                <div class="name">0601-重大危险</div>
                <div class="code-name">#dy--zhongdaweixian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shuaxin"></use>
                </svg>
                <div class="name">刷新</div>
                <div class="code-name">#dy-shuaxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-baocun"></use>
                </svg>
                <div class="name">保存</div>
                <div class="code-name">#dy-baocun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-Documentgeneration"></use>
                </svg>
                <div class="name">Document generation</div>
                <div class="code-name">#dy-Documentgeneration</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-suoxiao"></use>
                </svg>
                <div class="name">缩小</div>
                <div class="code-name">#dy-suoxiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-fangda"></use>
                </svg>
                <div class="name">放大</div>
                <div class="code-name">#dy-fangda</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-huanyuanhuabu"></use>
                </svg>
                <div class="name">还原画布</div>
                <div class="code-name">#dy-huanyuanhuabu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-biaodanzujian-biaoge1"></use>
                </svg>
                <div class="name">表单组件-表格</div>
                <div class="code-name">#dy-biaodanzujian-biaoge1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-document"></use>
                </svg>
                <div class="name">document</div>
                <div class="code-name">#dy-document</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-DOC"></use>
                </svg>
                <div class="name">DOC</div>
                <div class="code-name">#dy-DOC</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-PNG"></use>
                </svg>
                <div class="name">PNG</div>
                <div class="code-name">#dy-PNG</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-yunduanxiazai"></use>
                </svg>
                <div class="name">云端下载</div>
                <div class="code-name">#dy-yunduanxiazai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-Excel"></use>
                </svg>
                <div class="name">Excel</div>
                <div class="code-name">#dy-Excel</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-ppt1"></use>
                </svg>
                <div class="name">ppt</div>
                <div class="code-name">#dy-ppt1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-file_cad"></use>
                </svg>
                <div class="name">file_cad</div>
                <div class="code-name">#dy-file_cad</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shebeizhuangtai"></use>
                </svg>
                <div class="name">设备状态</div>
                <div class="code-name">#dy-shebeizhuangtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-fenzuguanli"></use>
                </svg>
                <div class="name">分组管理</div>
                <div class="code-name">#dy-fenzuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-ruanjiankaifabao"></use>
                </svg>
                <div class="name">软件开发包</div>
                <div class="code-name">#dy-ruanjiankaifabao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-zhongguohangtiantubiaoheji-weizhuanlunkuo-"></use>
                </svg>
                <div class="name">PPT</div>
                <div class="code-name">#dy-zhongguohangtiantubiaoheji-weizhuanlunkuo-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-"></use>
                </svg>
                <div class="name">工业的-2</div>
                <div class="code-name">#dy-gongyede-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-1"></use>
                </svg>
                <div class="name">工业的-4</div>
                <div class="code-name">#dy-gongyede-1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-2"></use>
                </svg>
                <div class="name">工业的-38</div>
                <div class="code-name">#dy-gongyede-2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-3"></use>
                </svg>
                <div class="name">工业的-43</div>
                <div class="code-name">#dy-gongyede-3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-4"></use>
                </svg>
                <div class="name">工业的-56</div>
                <div class="code-name">#dy-gongyede-4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-5"></use>
                </svg>
                <div class="name">工业的-63</div>
                <div class="code-name">#dy-gongyede-5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-6"></use>
                </svg>
                <div class="name">工业的-69</div>
                <div class="code-name">#dy-gongyede-6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-7"></use>
                </svg>
                <div class="name">工业的-73</div>
                <div class="code-name">#dy-gongyede-7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-8"></use>
                </svg>
                <div class="name">工业的-79</div>
                <div class="code-name">#dy-gongyede-8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyede-9"></use>
                </svg>
                <div class="name">工业的-98</div>
                <div class="code-name">#dy-gongyede-9</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-wumoxing"></use>
                </svg>
                <div class="name">物模型</div>
                <div class="code-name">#dy-wumoxing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-renwujincheng"></use>
                </svg>
                <div class="name">任务进程</div>
                <div class="code-name">#dy-renwujincheng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-xiaoxitongzhi"></use>
                </svg>
                <div class="name">消息通知</div>
                <div class="code-name">#dy-xiaoxitongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-zhihangfankui"></use>
                </svg>
                <div class="name">执行反馈</div>
                <div class="code-name">#dy-zhihangfankui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongdanqueren"></use>
                </svg>
                <div class="name">工单确认</div>
                <div class="code-name">#dy-gongdanqueren</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shanchusekuai"></use>
                </svg>
                <div class="name">删除色块</div>
                <div class="code-name">#dy-shanchusekuai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-PNG1"></use>
                </svg>
                <div class="name">PNG</div>
                <div class="code-name">#dy-PNG1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-PPT"></use>
                </svg>
                <div class="name">PPT</div>
                <div class="code-name">#dy-PPT</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-TEXT"></use>
                </svg>
                <div class="name">TEXT</div>
                <div class="code-name">#dy-TEXT</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-guandao"></use>
                </svg>
                <div class="name">管道</div>
                <div class="code-name">#dy-guandao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-guizeyinqing"></use>
                </svg>
                <div class="name">规则引擎</div>
                <div class="code-name">#dy-guizeyinqing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-jianceqi"></use>
                </svg>
                <div class="name">检测器</div>
                <div class="code-name">#dy-jianceqi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-liujisuan"></use>
                </svg>
                <div class="name">流计算</div>
                <div class="code-name">#dy-liujisuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-lianjieliu"></use>
                </svg>
                <div class="name">连接流</div>
                <div class="code-name">#dy-lianjieliu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shujuwajue"></use>
                </svg>
                <div class="name">数据挖掘</div>
                <div class="code-name">#dy-shujuwajue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-wangguan"></use>
                </svg>
                <div class="name">网关</div>
                <div class="code-name">#dy-wangguan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-wuguan"></use>
                </svg>
                <div class="name">AI</div>
                <div class="code-name">#dy-wuguan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-zhexiantu"></use>
                </svg>
                <div class="name">折线图</div>
                <div class="code-name">#dy-zhexiantu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shenjing"></use>
                </svg>
                <div class="name">神经</div>
                <div class="code-name">#dy-shenjing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-fuzhi"></use>
                </svg>
                <div class="name">复制</div>
                <div class="code-name">#dy-fuzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-drag"></use>
                </svg>
                <div class="name">drag</div>
                <div class="code-name">#dy-drag</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-ellipsis-vertical"></use>
                </svg>
                <div class="name">ellipsis-v</div>
                <div class="code-name">#dy-ellipsis-vertical</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gallery-view"></use>
                </svg>
                <div class="name">gallery-view</div>
                <div class="code-name">#dy-gallery-view</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-WIFI"></use>
                </svg>
                <div class="name">WIFI</div>
                <div class="code-name">#dy-WIFI</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-bug-report"></use>
                </svg>
                <div class="name">bug-report</div>
                <div class="code-name">#dy-bug-report</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-qrcode"></use>
                </svg>
                <div class="name">qrcode</div>
                <div class="code-name">#dy-qrcode</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-scan"></use>
                </svg>
                <div class="name">scan</div>
                <div class="code-name">#dy-scan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-cut"></use>
                </svg>
                <div class="name">cut</div>
                <div class="code-name">#dy-cut</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gift"></use>
                </svg>
                <div class="name">gift</div>
                <div class="code-name">#dy-gift</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-link"></use>
                </svg>
                <div class="name">link</div>
                <div class="code-name">#dy-link</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-poweroff"></use>
                </svg>
                <div class="name">poweroff</div>
                <div class="code-name">#dy-poweroff</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-key"></use>
                </svg>
                <div class="name">key</div>
                <div class="code-name">#dy-key</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-safety-certificate"></use>
                </svg>
                <div class="name">safety-certificate</div>
                <div class="code-name">#dy-safety-certificate</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-supervise"></use>
                </svg>
                <div class="name">supervise</div>
                <div class="code-name">#dy-supervise</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tag-subscipt"></use>
                </svg>
                <div class="name">tag-subscipt</div>
                <div class="code-name">#dy-tag-subscipt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-chart-pie-alt"></use>
                </svg>
                <div class="name">chart-pie-alt</div>
                <div class="code-name">#dy-chart-pie-alt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-chart-relation"></use>
                </svg>
                <div class="name">chart-relation</div>
                <div class="code-name">#dy-chart-relation</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-chart-scatter-plot"></use>
                </svg>
                <div class="name">chart-scatter-plot</div>
                <div class="code-name">#dy-chart-scatter-plot</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-chart-area"></use>
                </svg>
                <div class="name">chart-area</div>
                <div class="code-name">#dy-chart-area</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-chart-line"></use>
                </svg>
                <div class="name">chart-line</div>
                <div class="code-name">#dy-chart-line</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-chart-bar"></use>
                </svg>
                <div class="name">chart-bar</div>
                <div class="code-name">#dy-chart-bar</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-display-code"></use>
                </svg>
                <div class="name">display-code</div>
                <div class="code-name">#dy-display-code</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-display-arrow-right"></use>
                </svg>
                <div class="name">display-arrow-right</div>
                <div class="code-name">#dy-display-arrow-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-display-arrow-left"></use>
                </svg>
                <div class="name">display-arrow-left</div>
                <div class="code-name">#dy-display-arrow-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-laptop-error"></use>
                </svg>
                <div class="name">laptop-error</div>
                <div class="code-name">#dy-laptop-error</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-laptop-check"></use>
                </svg>
                <div class="name">laptop-check</div>
                <div class="code-name">#dy-laptop-check</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-laptop"></use>
                </svg>
                <div class="name">laptop</div>
                <div class="code-name">#dy-laptop</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-mobile-error"></use>
                </svg>
                <div class="name">mobile-error</div>
                <div class="code-name">#dy-mobile-error</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-mobile-check"></use>
                </svg>
                <div class="name">mobile-check</div>
                <div class="code-name">#dy-mobile-check</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-mobile-alt"></use>
                </svg>
                <div class="name">mobile-alt</div>
                <div class="code-name">#dy-mobile-alt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-aliwangwang"></use>
                </svg>
                <div class="name">aliwangwang</div>
                <div class="code-name">#dy-aliwangwang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-nail"></use>
                </svg>
                <div class="name">nail</div>
                <div class="code-name">#dy-nail</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-nail-fixed"></use>
                </svg>
                <div class="name">nail-fixed</div>
                <div class="code-name">#dy-nail-fixed</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-edit"></use>
                </svg>
                <div class="name">edit</div>
                <div class="code-name">#dy-edit</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-dollar"></use>
                </svg>
                <div class="name">dollar</div>
                <div class="code-name">#dy-dollar</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-transanction"></use>
                </svg>
                <div class="name">transanction</div>
                <div class="code-name">#dy-transanction</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-filter-fill"></use>
                </svg>
                <div class="name">filter-fill</div>
                <div class="code-name">#dy-filter-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-all-fill"></use>
                </svg>
                <div class="name">all-fill</div>
                <div class="code-name">#dy-all-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-databaseplus-fill"></use>
                </svg>
                <div class="name">database plus-fill</div>
                <div class="code-name">#dy-databaseplus-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-database-fill"></use>
                </svg>
                <div class="name">database-fill</div>
                <div class="code-name">#dy-database-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-commentlines-fill"></use>
                </svg>
                <div class="name">comment lines-fill</div>
                <div class="code-name">#dy-commentlines-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-commentdots-fill"></use>
                </svg>
                <div class="name">comment dots-fill</div>
                <div class="code-name">#dy-commentdots-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-paperplane-fill"></use>
                </svg>
                <div class="name">paper plane-fill</div>
                <div class="code-name">#dy-paperplane-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-eyeslash-fill"></use>
                </svg>
                <div class="name">eye slash-fill</div>
                <div class="code-name">#dy-eyeslash-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-eye-fill"></use>
                </svg>
                <div class="name">eye-fill</div>
                <div class="code-name">#dy-eye-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-lightbulb-fill"></use>
                </svg>
                <div class="name">lightbulb-fill</div>
                <div class="code-name">#dy-lightbulb-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-flag-fill"></use>
                </svg>
                <div class="name">flag-fill</div>
                <div class="code-name">#dy-flag-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tag-fill"></use>
                </svg>
                <div class="name">tag-fill</div>
                <div class="code-name">#dy-tag-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-position-fill"></use>
                </svg>
                <div class="name">position-fill</div>
                <div class="code-name">#dy-position-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-location-fill"></use>
                </svg>
                <div class="name">location-fill</div>
                <div class="code-name">#dy-location-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-map-fill"></use>
                </svg>
                <div class="name">map-fill</div>
                <div class="code-name">#dy-map-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-inboxin-fill"></use>
                </svg>
                <div class="name">inbox in-fill</div>
                <div class="code-name">#dy-inboxin-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-box-fill"></use>
                </svg>
                <div class="name">box-fill</div>
                <div class="code-name">#dy-box-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-databaseset-fill"></use>
                </svg>
                <div class="name">database set-fill</div>
                <div class="code-name">#dy-databaseset-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-layergroup-fill"></use>
                </svg>
                <div class="name">layer group-fill</div>
                <div class="code-name">#dy-layergroup-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-cry-fill"></use>
                </svg>
                <div class="name">cry-fill</div>
                <div class="code-name">#dy-cry-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-smile-fill"></use>
                </svg>
                <div class="name">smile-fill</div>
                <div class="code-name">#dy-smile-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-unlock-fill"></use>
                </svg>
                <div class="name">unlock-fill</div>
                <div class="code-name">#dy-unlock-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-lock-fill"></use>
                </svg>
                <div class="name">lock-fill</div>
                <div class="code-name">#dy-lock-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-alignright-fill"></use>
                </svg>
                <div class="name">align right-fill</div>
                <div class="code-name">#dy-alignright-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-alignleft-fill"></use>
                </svg>
                <div class="name">align left-fill</div>
                <div class="code-name">#dy-alignleft-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-borderbottom-fill"></use>
                </svg>
                <div class="name">border bottom-fill</div>
                <div class="code-name">#dy-borderbottom-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-bordertop-fill"></use>
                </svg>
                <div class="name">border top-fill</div>
                <div class="code-name">#dy-bordertop-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-aligncenter-fill"></use>
                </svg>
                <div class="name">align center-fill</div>
                <div class="code-name">#dy-aligncenter-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-borderverticle-fill"></use>
                </svg>
                <div class="name">border verticle-fill</div>
                <div class="code-name">#dy-borderverticle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-piccenter-fill"></use>
                </svg>
                <div class="name">pic center-fill</div>
                <div class="code-name">#dy-piccenter-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-picside-fill"></use>
                </svg>
                <div class="name">pic side-fill</div>
                <div class="code-name">#dy-picside-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-folderopen-fill"></use>
                </svg>
                <div class="name">folder open-fill</div>
                <div class="code-name">#dy-folderopen-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-folderplus-fill"></use>
                </svg>
                <div class="name">folder plus-fill</div>
                <div class="code-name">#dy-folderplus-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-folder-fill"></use>
                </svg>
                <div class="name">folder-fill</div>
                <div class="code-name">#dy-folder-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-file-SQL"></use>
                </svg>
                <div class="name">file-SQL</div>
                <div class="code-name">#dy-file-SQL</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-fileplus-fill"></use>
                </svg>
                <div class="name">file plus-fill</div>
                <div class="code-name">#dy-fileplus-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-file-fill"></use>
                </svg>
                <div class="name">file-fill</div>
                <div class="code-name">#dy-file-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-copy-fill"></use>
                </svg>
                <div class="name">copy-fill</div>
                <div class="code-name">#dy-copy-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-headset-fill"></use>
                </svg>
                <div class="name">headset-fill</div>
                <div class="code-name">#dy-headset-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-phone-fill"></use>
                </svg>
                <div class="name">phone-fill</div>
                <div class="code-name">#dy-phone-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-pausecircle-fill"></use>
                </svg>
                <div class="name">pause circle-fill</div>
                <div class="code-name">#dy-pausecircle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-stopcircle-fill"></use>
                </svg>
                <div class="name">stop circle-fill</div>
                <div class="code-name">#dy-stopcircle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-playcircle-fill"></use>
                </svg>
                <div class="name">play circle-fill</div>
                <div class="code-name">#dy-playcircle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-delete-fill"></use>
                </svg>
                <div class="name">delete-fill</div>
                <div class="code-name">#dy-delete-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-picture-fill"></use>
                </svg>
                <div class="name">picture-fill</div>
                <div class="code-name">#dy-picture-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-mail-fill"></use>
                </svg>
                <div class="name">mail-fill</div>
                <div class="code-name">#dy-mail-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-heart-fill"></use>
                </svg>
                <div class="name">heart-fill</div>
                <div class="code-name">#dy-heart-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-collection-fill"></use>
                </svg>
                <div class="name">collection-fill</div>
                <div class="code-name">#dy-collection-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-user-group-fill"></use>
                </svg>
                <div class="name">user-group-fill</div>
                <div class="code-name">#dy-user-group-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-userplus-fill"></use>
                </svg>
                <div class="name">user plus-fill</div>
                <div class="code-name">#dy-userplus-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-user-fill"></use>
                </svg>
                <div class="name">user-fill</div>
                <div class="code-name">#dy-user-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-cog-fill"></use>
                </svg>
                <div class="name">cog-fill</div>
                <div class="code-name">#dy-cog-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-clock-fill"></use>
                </svg>
                <div class="name">clock-fill</div>
                <div class="code-name">#dy-clock-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-calendaralt-fill"></use>
                </svg>
                <div class="name">calendar alt-fill</div>
                <div class="code-name">#dy-calendaralt-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-clouddownload-fill"></use>
                </svg>
                <div class="name">cloud download-fill</div>
                <div class="code-name">#dy-clouddownload-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-cloudupload-fill"></use>
                </svg>
                <div class="name">cloud upload-fill</div>
                <div class="code-name">#dy-cloudupload-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-exchange-fill"></use>
                </svg>
                <div class="name">exchange-fill</div>
                <div class="code-name">#dy-exchange-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-info-circle-fill"></use>
                </svg>
                <div class="name">info-circle-fill</div>
                <div class="code-name">#dy-info-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-question-circle-fill"></use>
                </svg>
                <div class="name">question-circle-fill</div>
                <div class="code-name">#dy-question-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-exclamationcircle-f"></use>
                </svg>
                <div class="name">exclamation circle-f</div>
                <div class="code-name">#dy-exclamationcircle-f</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-minus-circle-fill"></use>
                </svg>
                <div class="name">minus-circle-fill</div>
                <div class="code-name">#dy-minus-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-plus-circle-fill"></use>
                </svg>
                <div class="name">plus-circle-fill</div>
                <div class="code-name">#dy-plus-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-times-circle-fill"></use>
                </svg>
                <div class="name">times-circle-fill</div>
                <div class="code-name">#dy-times-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-check-circle-fill"></use>
                </svg>
                <div class="name">check-circle-fill</div>
                <div class="code-name">#dy-check-circle-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-compressalt-fill"></use>
                </svg>
                <div class="name">compress alt-fill</div>
                <div class="code-name">#dy-compressalt-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-expandalt-fill"></use>
                </svg>
                <div class="name">expand alt-fill</div>
                <div class="code-name">#dy-expandalt-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-filter"></use>
                </svg>
                <div class="name">filter</div>
                <div class="code-name">#dy-filter</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-all"></use>
                </svg>
                <div class="name">all</div>
                <div class="code-name">#dy-all</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-database-plus"></use>
                </svg>
                <div class="name">database-plus</div>
                <div class="code-name">#dy-database-plus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-database"></use>
                </svg>
                <div class="name">database</div>
                <div class="code-name">#dy-database</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-comment-lines"></use>
                </svg>
                <div class="name">comment-lines</div>
                <div class="code-name">#dy-comment-lines</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-comment-dots"></use>
                </svg>
                <div class="name">comment-dots</div>
                <div class="code-name">#dy-comment-dots</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-paper-plane"></use>
                </svg>
                <div class="name">paper-plane</div>
                <div class="code-name">#dy-paper-plane</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-eye-slash"></use>
                </svg>
                <div class="name">eye-slash</div>
                <div class="code-name">#dy-eye-slash</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-eye"></use>
                </svg>
                <div class="name">eye</div>
                <div class="code-name">#dy-eye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-lightbulb"></use>
                </svg>
                <div class="name">lightbulb</div>
                <div class="code-name">#dy-lightbulb</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-flag"></use>
                </svg>
                <div class="name">flag</div>
                <div class="code-name">#dy-flag</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tag"></use>
                </svg>
                <div class="name">tag</div>
                <div class="code-name">#dy-tag</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-position"></use>
                </svg>
                <div class="name">position</div>
                <div class="code-name">#dy-position</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-location"></use>
                </svg>
                <div class="name">location</div>
                <div class="code-name">#dy-location</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-map"></use>
                </svg>
                <div class="name">map</div>
                <div class="code-name">#dy-map</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-inbox-in"></use>
                </svg>
                <div class="name">inbox-in</div>
                <div class="code-name">#dy-inbox-in</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-box"></use>
                </svg>
                <div class="name">box</div>
                <div class="code-name">#dy-box</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-database-set"></use>
                </svg>
                <div class="name">database-set</div>
                <div class="code-name">#dy-database-set</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-layer-group"></use>
                </svg>
                <div class="name">layer-group</div>
                <div class="code-name">#dy-layer-group</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-wind-cry"></use>
                </svg>
                <div class="name">wind-cry</div>
                <div class="code-name">#dy-wind-cry</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-wind-smile"></use>
                </svg>
                <div class="name">wind-smile</div>
                <div class="code-name">#dy-wind-smile</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-unlock"></use>
                </svg>
                <div class="name">unlock</div>
                <div class="code-name">#dy-unlock</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-lock"></use>
                </svg>
                <div class="name">lock</div>
                <div class="code-name">#dy-lock</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-align-right"></use>
                </svg>
                <div class="name">align-right</div>
                <div class="code-name">#dy-align-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-align-left"></use>
                </svg>
                <div class="name">align-left</div>
                <div class="code-name">#dy-align-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-border-bottom"></use>
                </svg>
                <div class="name">border-bottom</div>
                <div class="code-name">#dy-border-bottom</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-border-top"></use>
                </svg>
                <div class="name">border-top</div>
                <div class="code-name">#dy-border-top</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-align-center"></use>
                </svg>
                <div class="name">align-center</div>
                <div class="code-name">#dy-align-center</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-border-verticle"></use>
                </svg>
                <div class="name">border-verticle</div>
                <div class="code-name">#dy-border-verticle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-pic-center"></use>
                </svg>
                <div class="name">pic-center</div>
                <div class="code-name">#dy-pic-center</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-pic-side"></use>
                </svg>
                <div class="name">pic-side</div>
                <div class="code-name">#dy-pic-side</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-folder-open"></use>
                </svg>
                <div class="name">folder-open</div>
                <div class="code-name">#dy-folder-open</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-folder-plus"></use>
                </svg>
                <div class="name">folder-plus</div>
                <div class="code-name">#dy-folder-plus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-folder"></use>
                </svg>
                <div class="name">folder</div>
                <div class="code-name">#dy-folder</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-file-SQL1"></use>
                </svg>
                <div class="name">file-SQL</div>
                <div class="code-name">#dy-file-SQL1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-file-plus"></use>
                </svg>
                <div class="name">file-plus</div>
                <div class="code-name">#dy-file-plus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-file"></use>
                </svg>
                <div class="name">file</div>
                <div class="code-name">#dy-file</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-copy"></use>
                </svg>
                <div class="name">copy</div>
                <div class="code-name">#dy-copy</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-headset"></use>
                </svg>
                <div class="name">headset</div>
                <div class="code-name">#dy-headset</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-phone"></use>
                </svg>
                <div class="name">phone</div>
                <div class="code-name">#dy-phone</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-pausecircle"></use>
                </svg>
                <div class="name">pause circle</div>
                <div class="code-name">#dy-pausecircle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-stopcircle"></use>
                </svg>
                <div class="name">stop circle</div>
                <div class="code-name">#dy-stopcircle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-playcircle"></use>
                </svg>
                <div class="name">play circle</div>
                <div class="code-name">#dy-playcircle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-delete"></use>
                </svg>
                <div class="name">delete</div>
                <div class="code-name">#dy-delete</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-picture"></use>
                </svg>
                <div class="name">picture</div>
                <div class="code-name">#dy-picture</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-mail"></use>
                </svg>
                <div class="name">mail</div>
                <div class="code-name">#dy-mail</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-like"></use>
                </svg>
                <div class="name">like</div>
                <div class="code-name">#dy-like</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-collection"></use>
                </svg>
                <div class="name">collection</div>
                <div class="code-name">#dy-collection</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-user-group"></use>
                </svg>
                <div class="name">user-group</div>
                <div class="code-name">#dy-user-group</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-account-plus"></use>
                </svg>
                <div class="name">account-plus</div>
                <div class="code-name">#dy-account-plus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-account"></use>
                </svg>
                <div class="name">account</div>
                <div class="code-name">#dy-account</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-cog"></use>
                </svg>
                <div class="name">cog</div>
                <div class="code-name">#dy-cog</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-clock"></use>
                </svg>
                <div class="name">clock</div>
                <div class="code-name">#dy-clock</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-calendar-alt"></use>
                </svg>
                <div class="name">calendar-alt</div>
                <div class="code-name">#dy-calendar-alt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-clouddownload"></use>
                </svg>
                <div class="name">cloud download</div>
                <div class="code-name">#dy-clouddownload</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-cloudupload"></use>
                </svg>
                <div class="name">cloud upload</div>
                <div class="code-name">#dy-cloudupload</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-exchange"></use>
                </svg>
                <div class="name">exchange</div>
                <div class="code-name">#dy-exchange</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-info-circle"></use>
                </svg>
                <div class="name">info-circle</div>
                <div class="code-name">#dy-info-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-question-circle"></use>
                </svg>
                <div class="name">question-circle</div>
                <div class="code-name">#dy-question-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-exclamation-circle"></use>
                </svg>
                <div class="name">exclamation-circle</div>
                <div class="code-name">#dy-exclamation-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-minus-circle"></use>
                </svg>
                <div class="name">minus-circle</div>
                <div class="code-name">#dy-minus-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-plus-circle"></use>
                </svg>
                <div class="name">plus-circle</div>
                <div class="code-name">#dy-plus-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-times-circle"></use>
                </svg>
                <div class="name">times-circle</div>
                <div class="code-name">#dy-times-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-check-circle"></use>
                </svg>
                <div class="name">check-circle</div>
                <div class="code-name">#dy-check-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-compress-alt"></use>
                </svg>
                <div class="name">compress-alt</div>
                <div class="code-name">#dy-compress-alt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-expand-alt"></use>
                </svg>
                <div class="name">expand-alt</div>
                <div class="code-name">#dy-expand-alt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-ban"></use>
                </svg>
                <div class="name">ban</div>
                <div class="code-name">#dy-ban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-minus"></use>
                </svg>
                <div class="name">minus</div>
                <div class="code-name">#dy-minus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-plus"></use>
                </svg>
                <div class="name">plus</div>
                <div class="code-name">#dy-plus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-times"></use>
                </svg>
                <div class="name">times</div>
                <div class="code-name">#dy-times</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-check"></use>
                </svg>
                <div class="name">check</div>
                <div class="code-name">#dy-check</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-search-minus"></use>
                </svg>
                <div class="name">search-minus</div>
                <div class="code-name">#dy-search-minus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-search-plus"></use>
                </svg>
                <div class="name">search-plus</div>
                <div class="code-name">#dy-search-plus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-search"></use>
                </svg>
                <div class="name">search</div>
                <div class="code-name">#dy-search</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-reply"></use>
                </svg>
                <div class="name">reply</div>
                <div class="code-name">#dy-reply</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-undo"></use>
                </svg>
                <div class="name">undo</div>
                <div class="code-name">#dy-undo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-redo"></use>
                </svg>
                <div class="name">redo</div>
                <div class="code-name">#dy-redo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-external-link"></use>
                </svg>
                <div class="name">external-link</div>
                <div class="code-name">#dy-external-link</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrows-alt"></use>
                </svg>
                <div class="name">arrows-alt</div>
                <div class="code-name">#dy-arrows-alt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-indent"></use>
                </svg>
                <div class="name">indent</div>
                <div class="code-name">#dy-indent</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-outdent"></use>
                </svg>
                <div class="name">outdent</div>
                <div class="code-name">#dy-outdent</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-sort-line"></use>
                </svg>
                <div class="name">sort-line</div>
                <div class="code-name">#dy-sort-line</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-switch"></use>
                </svg>
                <div class="name">switch</div>
                <div class="code-name">#dy-switch</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-wind-descending"></use>
                </svg>
                <div class="name">wind-descending</div>
                <div class="code-name">#dy-wind-descending</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-wind-ascending"></use>
                </svg>
                <div class="name">wind-ascending</div>
                <div class="code-name">#dy-wind-ascending</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-download"></use>
                </svg>
                <div class="name">download</div>
                <div class="code-name">#dy-download</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-upload"></use>
                </svg>
                <div class="name">upload</div>
                <div class="code-name">#dy-upload</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrow-to-bottom"></use>
                </svg>
                <div class="name">arrow-to-bottom</div>
                <div class="code-name">#dy-arrow-to-bottom</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrow-to-top"></use>
                </svg>
                <div class="name">arrow-to-top</div>
                <div class="code-name">#dy-arrow-to-top</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-long-arrow-down"></use>
                </svg>
                <div class="name">long-arrow-down</div>
                <div class="code-name">#dy-long-arrow-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-long-arrow-up"></use>
                </svg>
                <div class="name">long-arrow-up</div>
                <div class="code-name">#dy-long-arrow-up</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrow-right"></use>
                </svg>
                <div class="name">arrow-right</div>
                <div class="code-name">#dy-arrow-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrow-left"></use>
                </svg>
                <div class="name">arrow-left</div>
                <div class="code-name">#dy-arrow-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-sort"></use>
                </svg>
                <div class="name">sort</div>
                <div class="code-name">#dy-sort</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-sort-down"></use>
                </svg>
                <div class="name">sort-down</div>
                <div class="code-name">#dy-sort-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-sort-up"></use>
                </svg>
                <div class="name">sort-up</div>
                <div class="code-name">#dy-sort-up</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-caret-right"></use>
                </svg>
                <div class="name">caret-right</div>
                <div class="code-name">#dy-caret-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-caret-left"></use>
                </svg>
                <div class="name">caret-left</div>
                <div class="code-name">#dy-caret-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrows-v"></use>
                </svg>
                <div class="name">arrows-v</div>
                <div class="code-name">#dy-arrows-v</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-angle-double-down"></use>
                </svg>
                <div class="name">angle- double-down</div>
                <div class="code-name">#dy-angle-double-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-angle-double-up"></use>
                </svg>
                <div class="name">angle-double-up</div>
                <div class="code-name">#dy-angle-double-up</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-angle-double-right"></use>
                </svg>
                <div class="name">angle-double-right</div>
                <div class="code-name">#dy-angle-double-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-angle-double-left"></use>
                </svg>
                <div class="name">angle-double-left</div>
                <div class="code-name">#dy-angle-double-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-angle-down"></use>
                </svg>
                <div class="name">angle-down</div>
                <div class="code-name">#dy-angle-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-angle-up"></use>
                </svg>
                <div class="name">angle-up</div>
                <div class="code-name">#dy-angle-up</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-angle-right"></use>
                </svg>
                <div class="name">angle-right</div>
                <div class="code-name">#dy-angle-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-angle-left"></use>
                </svg>
                <div class="name">angle-left</div>
                <div class="code-name">#dy-angle-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-CADshezhi"></use>
                </svg>
                <div class="name">CAD设置2</div>
                <div class="code-name">#dy-CADshezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-paperclip"></use>
                </svg>
                <div class="name">paperclip</div>
                <div class="code-name">#dy-paperclip</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-CADshezhi-copy"></use>
                </svg>
                <div class="name">CAD设置2_相反</div>
                <div class="code-name">#dy-CADshezhi-copy</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-connection"></use>
                </svg>
                <div class="name">connection</div>
                <div class="code-name">#dy-connection</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-training"></use>
                </svg>
                <div class="name">training</div>
                <div class="code-name">#dy-training</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-process"></use>
                </svg>
                <div class="name">process</div>
                <div class="code-name">#dy-process</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-news"></use>
                </svg>
                <div class="name">news</div>
                <div class="code-name">#dy-news</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-save"></use>
                </svg>
                <div class="name">save</div>
                <div class="code-name">#dy-save</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-print"></use>
                </svg>
                <div class="name">print</div>
                <div class="code-name">#dy-print</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-new-releases"></use>
                </svg>
                <div class="name">new-releases</div>
                <div class="code-name">#dy-new-releases</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-release"></use>
                </svg>
                <div class="name">release</div>
                <div class="code-name">#dy-release</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-alert"></use>
                </svg>
                <div class="name">alert</div>
                <div class="code-name">#dy-alert</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-backspace"></use>
                </svg>
                <div class="name">backspace</div>
                <div class="code-name">#dy-backspace</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gem"></use>
                </svg>
                <div class="name">gem</div>
                <div class="code-name">#dy-gem</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-integral"></use>
                </svg>
                <div class="name">integral</div>
                <div class="code-name">#dy-integral</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-star-circle"></use>
                </svg>
                <div class="name">star-circle</div>
                <div class="code-name">#dy-star-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-user-circle"></use>
                </svg>
                <div class="name">user-circle</div>
                <div class="code-name">#dy-user-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-cloud-machine-fill"></use>
                </svg>
                <div class="name">cloud-machine-fill</div>
                <div class="code-name">#dy-cloud-machine-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-cloud-machine"></use>
                </svg>
                <div class="name">cloud-machine</div>
                <div class="code-name">#dy-cloud-machine</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-terminal-fill"></use>
                </svg>
                <div class="name">terminal-fill</div>
                <div class="code-name">#dy-terminal-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-terminal"></use>
                </svg>
                <div class="name">terminal</div>
                <div class="code-name">#dy-terminal</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shopping-cart-fill"></use>
                </svg>
                <div class="name">shopping-cart-fill</div>
                <div class="code-name">#dy-shopping-cart-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-iframetianjia"></use>
                </svg>
                <div class="name">iframe添加</div>
                <div class="code-name">#dy-iframetianjia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tupiantianjia"></use>
                </svg>
                <div class="name">图片添加</div>
                <div class="code-name">#dy-tupiantianjia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-resource"></use>
                </svg>
                <div class="name">resource</div>
                <div class="code-name">#dy-resource</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-wind-loading"></use>
                </svg>
                <div class="name">wind-loading</div>
                <div class="code-name">#dy-wind-loading</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-rank"></use>
                </svg>
                <div class="name">rank</div>
                <div class="code-name">#dy-rank</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-zitiyanse"></use>
                </svg>
                <div class="name">字体颜色</div>
                <div class="code-name">#dy-zitiyanse</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-sync-alt"></use>
                </svg>
                <div class="name">sync-alt</div>
                <div class="code-name">#dy-sync-alt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-compass"></use>
                </svg>
                <div class="name">compass</div>
                <div class="code-name">#dy-compass</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrow-alt-from-top"></use>
                </svg>
                <div class="name">arrow-alt- from-top</div>
                <div class="code-name">#dy-arrow-alt-from-top</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrow-alt-from-botto"></use>
                </svg>
                <div class="name">arrow-alt-from-botto</div>
                <div class="code-name">#dy-arrow-alt-from-botto</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-menu"></use>
                </svg>
                <div class="name">menu</div>
                <div class="code-name">#dy-menu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-excel"></use>
                </svg>
                <div class="name">excel</div>
                <div class="code-name">#dy-excel</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shebeikaifa"></use>
                </svg>
                <div class="name">设备开发</div>
                <div class="code-name">#dy-shebeikaifa</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-icon-drag"></use>
                </svg>
                <div class="name">icon-drag</div>
                <div class="code-name">#dy-icon-drag</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-early-warning"></use>
                </svg>
                <div class="name">early-warning</div>
                <div class="code-name">#dy-early-warning</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-share"></use>
                </svg>
                <div class="name">share</div>
                <div class="code-name">#dy-share</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-share1"></use>
                </svg>
                <div class="name">share</div>
                <div class="code-name">#dy-share1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-Png"></use>
                </svg>
                <div class="name">Png</div>
                <div class="code-name">#dy-Png</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-Jpg"></use>
                </svg>
                <div class="name">Jpg</div>
                <div class="code-name">#dy-Jpg</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-Pdf"></use>
                </svg>
                <div class="name">Pdf</div>
                <div class="code-name">#dy-Pdf</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-doc2"></use>
                </svg>
                <div class="name">doc</div>
                <div class="code-name">#dy-doc2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-img1"></use>
                </svg>
                <div class="name">img</div>
                <div class="code-name">#dy-img1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-Excel1"></use>
                </svg>
                <div class="name">Excel</div>
                <div class="code-name">#dy-Excel1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-management-"></use>
                </svg>
                <div class="name">management</div>
                <div class="code-name">#dy-management-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-accesskeys"></use>
                </svg>
                <div class="name">accesskeys</div>
                <div class="code-name">#dy-accesskeys</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-zhunbeiliangchan"></use>
                </svg>
                <div class="name">准备量产</div>
                <div class="code-name">#dy-zhunbeiliangchan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tianjiazituzhi-"></use>
                </svg>
                <div class="name">添加子图纸</div>
                <div class="code-name">#dy-tianjiazituzhi-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-document1"></use>
                </svg>
                <div class="name">document</div>
                <div class="code-name">#dy-document1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-Textfile"></use>
                </svg>
                <div class="name">Text file 1</div>
                <div class="code-name">#dy-Textfile</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-CADshezhi1"></use>
                </svg>
                <div class="name">CAD设置</div>
                <div class="code-name">#dy-CADshezhi1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-arrow-sortdown-smal"></use>
                </svg>
                <div class="name">arrow-sort down-small</div>
                <div class="code-name">#dy-arrow-sortdown-smal</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-minus-square-fill"></use>
                </svg>
                <div class="name">minus-square-fill</div>
                <div class="code-name">#dy-minus-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-plus-square-fill"></use>
                </svg>
                <div class="name">plus-square-fill</div>
                <div class="code-name">#dy-plus-square-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-minus-square"></use>
                </svg>
                <div class="name">minus-square</div>
                <div class="code-name">#dy-minus-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-plus-square"></use>
                </svg>
                <div class="name">plus-square</div>
                <div class="code-name">#dy-plus-square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-stepmode"></use>
                </svg>
                <div class="name">step mode</div>
                <div class="code-name">#dy-stepmode</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-scrollingmode"></use>
                </svg>
                <div class="name">scrolling mode</div>
                <div class="code-name">#dy-scrollingmode</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-kongjianxuanzhong"></use>
                </svg>
                <div class="name">控件选中</div>
                <div class="code-name">#dy-kongjianxuanzhong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-excel-"></use>
                </svg>
                <div class="name">excel-01</div>
                <div class="code-name">#dy-excel-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-shoppingcart"></use>
                </svg>
                <div class="name">shopping cart</div>
                <div class="code-name">#dy-shoppingcart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-Excel2"></use>
                </svg>
                <div class="name">Excel</div>
                <div class="code-name">#dy-Excel2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-waiting-fill"></use>
                </svg>
                <div class="name">waiting-fill</div>
                <div class="code-name">#dy-waiting-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-waiting"></use>
                </svg>
                <div class="name">waiting</div>
                <div class="code-name">#dy-waiting</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-right-arrow-rect"></use>
                </svg>
                <div class="name">right-arrow-rect</div>
                <div class="code-name">#dy-right-arrow-rect</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-left-arrow-rect"></use>
                </svg>
                <div class="name">left-arrow-rect</div>
                <div class="code-name">#dy-left-arrow-rect</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-gongyejichulingjian"></use>
                </svg>
                <div class="name">工业基础零件</div>
                <div class="code-name">#dy-gongyejichulingjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tubiao_daochuCAD"></use>
                </svg>
                <div class="name">导出CAD</div>
                <div class="code-name">#dy-tubiao_daochuCAD</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-tubiao_daoruCAD"></use>
                </svg>
                <div class="name">导入CAD</div>
                <div class="code-name">#dy-tubiao_daoruCAD</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-bell"></use>
                </svg>
                <div class="name">bell</div>
                <div class="code-name">#dy-bell</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-jiegouhuashuju"></use>
                </svg>
                <div class="name">structured data</div>
                <div class="code-name">#dy-jiegouhuashuju</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-xiangliang"></use>
                </svg>
                <div class="name">vector</div>
                <div class="code-name">#dy-xiangliang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-jpg1"></use>
                </svg>
                <div class="name">jpg</div>
                <div class="code-name">#dy-jpg1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-NEW-copy"></use>
                </svg>
                <div class="name">NEW</div>
                <div class="code-name">#dy-NEW-copy</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-HOT-copy"></use>
                </svg>
                <div class="name">HOT</div>
                <div class="code-name">#dy-HOT-copy</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-xitong-jiaosepeizhi"></use>
                </svg>
                <div class="name">系统-角色配置</div>
                <div class="code-name">#dy-xitong-jiaosepeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-ppt2"></use>
                </svg>
                <div class="name">ppt</div>
                <div class="code-name">#dy-ppt2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#dy-png"></use>
                </svg>
                <div class="name">png</div>
                <div class="code-name">#dy-png</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
